@font-face {
  font-family: 'gillsans-light';
  src: url("/fonts/gillsans_light.eot");
  src: url("/fonts/gillsans_light.eot?#iefix") format("embedded-opentype"), url("/fonts/gillsans_light.woff") format("woff"), url("/fonts/gillsans_light.ttf") format("truetype");
}

@font-face {
  font-family: 'gillsans-light';
  src: url("/fonts/gillsans_light.eot");
  src: url("/fonts/gillsans_light.eot?#iefix") format("embedded-opentype"), url("/fonts/gillsans_light.woff") format("woff"), url("/fonts/gillsans_light.ttf") format("truetype");
}

@font-face {
  font-family: 'Gill Sans MT';
  src: url("/fonts/gillsans.eot");
  src: url("/fonts/gillsans.eot?#iefix") format("embedded-opentype"), url("/fonts/gillsans.woff") format("woff"), url("/fonts/gillsans.ttf") format("truetype");
}

@font-face {
  font-family: 'Trueno';
  src: url("/fonts/TruenoLt.eot");
  src: local("Trueno Light"), local("TruenoLt"), url("/fonts/TruenoLt.eot?#iefix") format("embedded-opentype"), url("/fonts/TruenoLt.woff2") format("woff2"), url("/fonts/TruenoLt.woff") format("woff"), url("/fonts/TruenoLt.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Trueno';
  src: url("/fonts/TruenoRg.eot");
  src: local("Trueno Regular"), local("TruenoRg"), url("/fonts/TruenoRg.eot?#iefix") format("embedded-opentype"), url("/fonts/TruenoRg.woff2") format("woff2"), url("/fonts/TruenoRg.woff") format("woff"), url("/fonts/TruenoRg.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Trueno';
  src: url("/fonts/TruenoBd.eot");
  src: local("Trueno Bold"), local("TruenoBd"), url("/fonts/TruenoBd.eot?#iefix") format("embedded-opentype"), url("/fonts/TruenoBd.woff2") format("woff2"), url("/fonts/TruenoBd.woff") format("woff"), url("/fonts/TruenoBd.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

body, p, span {
  font-family: 'Trueno', sans-serif;
  font-weight: 300;
}

h1.-i, h2.-i, h3.-i, h4.-i, h5.-i, h6.-i, .h1.-i, .h2.-i, .h3.-i, .h4.-i, .h5.-i, .h6.-i {
  font-style: italic;
}

h1.-semibold, h2.-semibold, h3.-semibold, h4.-semibold, h5.-semibold, h6.-semibold, .h1.-semibold, .h2.-semibold, .h3.-semibold, .h4.-semibold, .h5.-semibold, .h6.-semibold {
  font-weight: 600;
}

h1.-bold, h2.-bold, h3.-bold, h4.-bold, h5.-bold, h6.-bold, .h1.-bold, .h2.-bold, .h3.-bold, .h4.-bold, .h5.-bold, .h6.-bold {
  font-weight: 700;
}

h1.-extrabold, h2.-extrabold, h3.-extrabold, h4.-extrabold, h5.-extrabold, h6.-extrabold, .h1.-extrabold, .h2.-extrabold, .h3.-extrabold, .h4.-extrabold, .h5.-extrabold, .h6.-extrabold {
  font-weight: 800;
}

.home-head {
  font-size: 18px;
  line-height: 38px;
  padding-top: 2px;
  font-weight: bold;
  margin: 0;
}

.uppercase {
  text-transform: uppercase;
}

p, li {
  font-size: 14px;
  font-size: 0.875rem;
}

.p-large p {
  font-size: 16px;
  font-size: 1rem;
}

h1 {
  font-size: 20px;
  font-size: 1.25rem;
  padding-bottom: 8px;
  margin-bottom: 20px;
}

h2, .h2 {
  font-size: 28px;
  font-size: 1.75rem;
}

h3, .h3 {
  font-size: 28px;
  font-size: 1.75rem;
}

h4, .h4 {
  font-size: 28px;
  font-size: 1.75rem;
}

h5, .h5 {
  font-size: 28px;
  font-size: 1.75rem;
}

h6, .h6 {
  font-size: 11px;
  font-size: 0.6875rem;
}

.small {
  font-size: 28px;
  font-size: 1.75rem;
}

.content-2022 h1, .content-2022 .h1 {
  font-size: 2.2em;
  font-weight: bold;
}

.content-2022 h2, .content-2022 .h2 {
  font-size: 1.8em;
  font-weight: bold;
}

.content-2022 h3, .content-2022 .h3 {
  text-transform: uppercase;
  font-size: 1.5em;
  font-weight: bold;
}

.content-2022 h4, .content-2022 .h4 {
  font-size: 1.3em;
}

.content-2022 h5, .content-2022 .h5 {
  font-size: 1.2em;
}

.content-2022 h6, .content-2022 .h6 {
  font-size: 1.1em;
}

.content-2022 p, .content-2022 span {
  font-size: 1em;
}

.content-2022 p.lead, .content-2022 span.lead {
  font-size: 1.2em;
  font-weight: normal;
}

.content-2022 p.lead strong, .content-2022 span.lead strong {
  font-weight: bold;
}

.content-2024 .rounded {
  border-radius: 10px !important;
}

.content-2024 h1, .content-2024 .h1 {
  font-weight: bold;
}

.content-2024 h2, .content-2024 .h2 {
  font-weight: bold;
}

.content-2024 h3, .content-2024 .h3 {
  text-transform: uppercase;
  font-weight: bold;
}

.content-2024 p.lead, .content-2024 span.lead {
  font-weight: normal;
}

.content-2024 p.lead strong, .content-2024 span.lead strong {
  font-weight: bold;
}

.content-2024 p.small, .content-2024 span.small {
  font-weight: 200;
}

.content-2024 .text-normal {
  text-transform: none;
}

.backToTopButton {
  color: #000;
  padding: 5px 20px;
  font-style: italic;
  font-size: 18px;
}

.backToTopButton:hover {
  text-decoration: none;
  color: #000;
}

.fw-100 {
  font-weight: 100;
}

.fw-200 {
  font-weight: 200;
}

.fw-300 {
  font-weight: 300;
}

.fw-400 {
  font-weight: 400;
}

.fw-500 {
  font-weight: 500;
}

.fw-600 {
  font-weight: 600;
}

.fw-700 {
  font-weight: 700;
}

.fw-800 {
  font-weight: 800;
}

.fw-bold {
  font-weight: bold;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 90px;
}

.container-fluid {
  max-width: 1340px;
}

.clearfix::after {
  display: block;
  content: "";
  clear: both;
}

.video-16x9 {
  position: relative;
  padding-bottom: 56.8%;
  width: 100%;
}

.video-16x9 iframe.video__aspect {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.shadow {
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.rounded {
  border-radius: 5px;
}

.card.related-card .card-body {
  display: flex;
  flex-direction: column;
  position: relative;
}

.card.related-card .card-body:before {
  content: '';
  display: block;
  position: absolute;
  top: -14px;
  left: 1.25rem;
  height: 0;
  width: 0;
  border-left: 9px solid transparent;
  border-right: 9px solid transparent;
  border-bottom: 14px solid white;
}

.card.related-card .card-body .card-title {
  font-size: 20px;
}

.card.related-card .card-body .card-text {
  font-size: 1rem;
}

.card.related-card .card-body .btn {
  margin-top: auto;
  align-self: flex-start;
}

.card.related-card:hover, .card.related-card:focus {
  background: #019D4E;
  color: white;
}

.card.related-card:hover .card-body:before, .card.related-card:focus .card-body:before {
  border-bottom: 14px solid #019D4E;
}

.flex-cards {
  display: flex;
  flex-direction: column;
}

.flex-cards .card {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: auto;
  margin-bottom: 2rem;
}

.btn {
  border-radius: 0;
}

.btn-primary {
  background-color: #019D4E;
  border-color: #019D4E;
}

.btn-primary:hover, .btn-primary:focus {
  background-color: #016631;
  border-color: #016631;
}

.btn-inverse-primary {
  background-color: white;
  color: #019D4E;
  border-color: #019D4E;
}

.btn-inverse-primary:hover, .btn-inverse-primary:focus {
  color: #016631;
}

.download-btn-wrap {
  background: white;
  display: flex;
  padding: 1rem 1rem 1rem 70px;
  position: relative;
}

.download-btn-wrap:before {
  position: absolute;
  z-index: 1;
  content: '';
  height: 38px;
  width: 38px;
  left: 1rem;
  top: 1rem;
  display: block;
  background: url("../assets/download.svg");
  background-size: 100%;
  background-repeat: no-repeat;
  opacity: 1;
  transition: opacity 0.2s ease-in-out;
}

.download-btn-wrap .text {
  display: none;
}

@media (min-width: 768px) {
  .download-btn-wrap .text {
    display: block;
    -ms-grid-row-align: center;
    align-self: center;
    color: #22252A;
    font-size: 18px;
    font-weight: bold;
  }
}

.download-btn-wrap .btn {
  margin-left: auto;
}

.download-btn-wrap:hover, .download-btn-wrap:focus {
  text-decoration: none;
}

.download-btn-wrap:hover:before, .download-btn-wrap:focus:before {
  opacity: 0.6;
}

.download-btn-wrap:hover .btn-primary, .download-btn-wrap:focus .btn-primary {
  background-color: #016631;
  border-color: #016631;
}

.bg-grey {
  background-color: #d0d0d0;
}

.bg-black {
  background: #000;
}

.bg-gold {
  background: #c5a052;
  background: linear-gradient(90deg, #c5a052 0%, #faf4bc 25%, #c5a052 50%, #faf4bc 75%, #c5a052 100%);
}

.bg-cream {
  background: #E8DCC0;
}

.bg-lightCream {
  background: #F2EDE1;
}

.bg-water {
  height: 50px;
  width: 100%;
  background-color: navy;
  background-image: url("/assets/infographics/water.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.bg-water-slim {
  height: 25px;
}

.fade-up--1 {
  animation: fadeInUp 0.8s 0s;
  animation-fill-mode: both;
}

.fade-up--2 {
  animation: fadeInUp 0.8s 0.25s;
  animation-fill-mode: both;
}

.fade-up--3 {
  animation: fadeInUp 0.8s 0.4s;
  animation-fill-mode: both;
}

.fade-up--4 {
  animation: fadeInUp 0.8s 0.5s;
  animation-fill-mode: both;
}

.fade-up--5 {
  animation: fadeInUp 0.8s 0.6s;
  animation-fill-mode: both;
}

.fade-up--6 {
  animation: fadeInUp 0.8s 0.7s;
  animation-fill-mode: both;
}

.fade-up--7 {
  animation: fadeInUp 0.8s 0.8s;
  animation-fill-mode: both;
}

.fade-up--8 {
  animation: fadeInUp 0.8s 0.9s;
  animation-fill-mode: both;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(50px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.header {
  margin-bottom: 5px;
}

.pageTitle {
  font-size: 24px;
  line-height: calc(24px + 2.4px);
  font-weight: 600;
}

@media screen and (min-width: 376px) {
  .pageTitle {
    font-size: calc(24px + 9 * ((100vw - 376px) / 794));
    line-height: calc(24px + 9 * ((100vw - 376px) / 794) + 2.4px);
  }
}

@media screen and (min-width: 1170px) {
  .pageTitle {
    font-size: 33px;
    line-height: calc(33px + 3.3px);
  }
}

.siteLogo {
  max-width: 130px;
  margin-left: 20px;
  margin-top: 10px;
}

@media screen and (min-width: 769px) {
  .siteLogo {
    max-width: 160px;
  }
}

.siteLogo-24 {
  max-height: 65px;
}

@media screen and (min-width: 769px) {
  .siteLogo {
    width: 200px;
    margin-left: 20px;
    margin-top: 10px;
  }
}

.flagImage {
  padding: 0 15px 0 20px;
  margin: 10px 0 20px 0;
  border-left: 3px solid #000;
  max-width: 170px;
}

.largeTextHeading {
  font-size: 15px;
  line-height: 18px;
}

.years-10 {
  display: block;
  margin-top: 5px;
  background-color: #989898;
  letter-spacing: 0.05em;
  color: #fff;
  padding: 5px;
  text-transform: uppercase;
  font-weight: bold;
  text-align: center;
  font-size: calc(20px + 0.3vw);
}

.click-to-save-switch {
  flex-direction: column;
  position: relative;
  color: #000;
  text-decoration: none;
}

.click-to-save-switch h2 {
  margin-top: 4px;
  color: #000;
  font-size: calc(12px + 0.2vw);
  font-weight: bold;
  white-space: nowrap;
}

.click-to-save-switch img {
  max-width: 100px;
}

.btn-vulindlela {
  background-color: #0e2a49;
}

.btn-vulindlela:hover {
  background-color: #164374;
}

.btn-primary.disabled {
  background-color: #ccc;
  color: #000;
  cursor: not-allowed;
  pointer-events: none;
}

.ba-slider {
  max-width: 350px;
  margin: 0 auto;
  display: block;
  position: relative;
}

.ba-slider .beforeafterSlider {
  opacity: 0;
}

.ba-slider.showSlides .beforeafterSlider {
  opacity: 1;
  transition: opacity 0.5s 0.4s;
}

.ba-slider img {
  max-width: initial !important;
}

@media screen and (min-width: 769px) {
  .ba-slider {
    max-width: 550px;
  }
}

@media screen and (min-width: 976px) {
  .ba-slider {
    max-width: 600px;
  }
}

.ba-slider__container {
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+34,ffffff+34,e8e8e8+35,e8e8e8+62,e8e8e8+62,ffffff+63,ffffff+100&0+0,0+35,1+36,1+62,0+63,0+100 */
  /* FF3.6-15 */
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 34%, rgba(232, 232, 232, 0) 34%, #e8e8e8 34%, #e8e8e8 62%, rgba(255, 255, 255, 0) 62%, rgba(255, 255, 255, 0) 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=0 );
  /* IE6-9 */
}

.slider-small {
  width: 100%;
  padding-bottom: 100%;
  background-size: cover;
  position: relative;
}

.slider-small__wrapper {
  cursor: pointer;
  text-transform: uppercase;
}

.slider-small__inner {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 50%;
  background-size: cover;
  background-position: top left;
}

.hovercard {
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
  transform: scale(1);
}

.hovercard:hover {
  transform: scale(1.05);
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  text-decoration: none;
}

.drop {
  position: relative;
}

.drop-menu {
  position: absolute;
  top: 100%;
  left: 0;
  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  border-radius: 5px;
  padding: 5px;
  z-index: 1000;
  min-width: 150px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  pointer-events: none;
}

.active .drop-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

a.drop-item {
  display: block;
  padding: 10px;
  text-decoration: none;
  color: #333;
}

a.drop-item:hover {
  background-color: #f0f0f0;
}

.category-feed h1 {
  font-size: calc(16px + 1.1vw);
  padding-left: 20px;
  margin: 0;
  font-weight: bold;
  display: block;
}

.category-feed__titlewrapper {
  background-color: #f1f0f0;
}

.category-feed__pagination {
  background-color: #f1f0f0;
  box-shadow: 1px 2px 6px #dbdbdb;
  margin-bottom: 30px;
  border-radius: 6px;
}

.category-feed__pagination a {
  color: rgba(0, 0, 0, 0.7);
  background-color: rgba(255, 255, 255, 0.7);
  display: inline-block;
  padding: 4px 15px;
  border-radius: 30px;
  text-decoration: none;
}

.category-feed__pagination a:hover {
  color: black;
  background-color: white;
}

.category-feed__item a {
  text-decoration: none;
}

.category-feed__item h2 {
  font-size: calc(14px + 0.5vw);
}

.category-feed__item p {
  font-size: calc(12px + 0.2vw);
  opacity: 0.7;
}

.feature-image {
  position: relative;
  margin: 25px 0 0;
}

.content-2022 .feature-image {
  margin: 0;
}

.feature-image img {
  max-width: 100%;
}

.feature-image:after {
  content: '';
  display: block;
  height: 20px;
  position: absolute;
  top: calc(100% - 1px);
  left: 0;
  right: 0;
  background-image: url(/img/feature-shadow-bottom.png);
  background-size: 100% 100%;
}

.feature-image .shadows-l-r:before, .feature-image .shadows-l-r:after {
  content: '';
  display: block;
  width: 20px;
  position: absolute;
  top: 0;
  bottom: 0;
  background-size: 100% 100%;
}

.feature-image .shadows-l-r:before {
  left: 100%;
  background-image: url(/img/feature-shadow-lr.png);
  transform: rotate(180deg);
}

.feature-image .shadows-l-r:after {
  right: 100%;
  background-image: url(/img/feature-shadow-lr.png);
}

.feature-image-2022 {
  padding-top: 400px;
  position: relative;
}

.feature-image-2022__wrapper {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.feature-image-2022:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1;
  height: 20px;
  background: rgba(0, 0, 0, 0);
  background: linear-gradient(0deg, rgba(0, 0, 0, 0) 30%, black 100%);
  pointer-events: none;
}

.ov-filter {
  text-decoration: none;
  display: block;
  padding: 5px 10px;
  border-radius: 5px;
}

.ov-filter.active {
  background-color: #E5E5E5;
  display: block;
}

.ov-filter:hover:not(.active) {
  background-color: #fff;
  text-decoration: none;
}

@media (min-width: 768px) {
  .hero-image {
    position: absolute;
    top: 0;
    left: 30px;
    width: 100%;
    height: 100%;
  }
}

@media (min-width: 1350px) {
  .hero-image {
    left: 100px;
    width: calc(50vw + 30px);
  }
}

.mheader {
  display: block;
  position: relative;
  padding-bottom: 10%;
  background-image: url(/img/sona-line.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  border-top: 5px solid #fff;
}

@media screen and (min-width: 576px) {
  .mheader {
    background-image: url(/img/sona-square.png);
    background-position: left top;
    padding-bottom: 50%;
    width: 90%;
    border-top: 20px solid #fff;
  }
}

.main-left-nav {
  padding: 10px 0px 10px 0;
  margin: 0;
  list-style-type: none;
}

@media screen and (min-width: 576px) {
  .main-left-nav {
    padding: 20px 15px 30px 0;
  }
}

.main-left-nav > li {
  padding: 0;
  margin: 0;
  font-weight: bold;
}

.main-left-nav > li > ul {
  padding-left: 30px;
  margin-bottom: 10px;
}

.main-left-nav > li > ul > li {
  list-style: disc;
  font-weight: normal;
}

.main-left-nav > li a {
  display: block;
  border-bottom: 1px solid #efefef;
  line-height: 18px;
  padding: 9px 10px 9px 0;
  color: #555;
  text-decoration: none;
  position: relative;
}

.main-left-nav > li a:hover {
  color: #666;
}

.main-left-nav > li a:hover:after {
  background-position: 0 -41px;
}

.main-left-nav > li a.on {
  color: #BD512D;
}

.main-left-nav > li a.on:after {
  background-position: 0 0;
}

.main-left-nav > li a.home {
  color: #989898;
}

.main-left-nav > li a.home:after {
  content: none;
}

.subs {
  list-style-type: none;
  margin: 15px 0;
  padding-left: 0;
}

.subs li a {
  border: none;
  line-height: 16px;
  padding: 4px 0;
}

.subs li a:after {
  display: none;
}

.nav__wrapper {
  max-height: 0px;
  padding-bottom: 20px;
  overflow: hidden;
  transition: max-height 0.4s;
}

.open-navigation .nav__wrapper {
  max-height: 1000px;
}

@media screen and (min-width: 576px) {
  .nav__wrapper {
    max-height: initial;
    overflow: visible;
    padding-bottom: 30px;
    height: auto;
  }
}

.nav-greybar {
  background-color: #ccc;
}

.nav-greybar__navlist {
  display: flex;
}

.nav-greybar__navlist li a {
  display: block;
  font-size: calc(13px + 0.1vw);
  color: #444;
  line-height: calc(22px + 0.1vw);
  padding: 5px 15px;
  text-decoration: none;
}

.nav-greybar__navlist li a:hover {
  background-color: rgba(255, 255, 255, 0.4);
  color: #000;
}

.nav-greybar__navlist li a:first-child {
  padding-left: 10px;
}

body, html {
  height: 100vh;
}

.nav__sublinks {
  display: block;
  margin: 3px;
  margin-left: 0px;
  padding: 3px 10px 2px 10px;
  background-color: #999;
  opacity: 0.9;
  font-size: 13px;
  font-size: 0.8125rem;
  color: #fff;
}

.nav__sublinks--head {
  font-size: 15px;
  font-size: 0.9375rem;
  border-bottom: 1px solid #A3A7AE;
  padding-bottom: 4px;
}

.nav__sublinks--header {
  width: 100%;
  text-align: center;
  font-size: 18px;
  padding: 10px;
}

.nav__sublinks--header span {
  display: block;
}

@media screen and (min-width: 576px) {
  .nav__sublinks--header {
    margin-top: 25px;
  }
}

.nav__sublinks:hover {
  opacity: 1;
  color: #fff;
}

.nav__sublinks--feature {
  background-color: #C74524;
}

.nav__sublinks--news {
  background-color: #FFC108;
  color: #016631;
}

.nav__sublinks--news:hover {
  color: #000;
}

.hamburger {
  padding: 0px 15px 0 15px;
  display: inline-block;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  overflow: visible;
  transform: scale(0.85) translateY(10px);
}

.hamburger:focus {
  outline: none;
}

.hamburger:hover {
  opacity: 0.7;
}

.open-navigation .hamburger:hover {
  opacity: 0.7;
}

.open-navigation .hamburger .hamburger-inner,
.open-navigation .hamburger .hamburger-inner::before,
.open-navigation .hamburger .hamburger-inner::after {
  background-color: #fff;
}

.hamburger-box {
  width: 40px;
  height: 24px;
  display: inline-block;
  position: relative;
}

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px;
}

.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
  width: 40px;
  height: 4px;
  background-color: #fff;
  border-radius: 4px;
  position: absolute;
  transition-property: transform;
  transition-duration: 0.15s;
  transition-timing-function: ease;
}

.hamburger-inner::before, .hamburger-inner::after {
  content: "";
  display: block;
}

.hamburger-inner::before {
  top: -10px;
}

.hamburger-inner::after {
  bottom: -10px;
}

.hamburger--slider .hamburger-inner {
  top: 2px;
}

.hamburger--slider .hamburger-inner::before {
  top: 10px;
  transition-property: transform, opacity;
  transition-timing-function: ease;
  transition-duration: 0.15s;
}

.hamburger--slider .hamburger-inner::after {
  top: 20px;
}

.open-navigation .hamburger--slider .hamburger-inner {
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.open-navigation .hamburger--slider .hamburger-inner::before {
  transform: rotate(-45deg) translate3d(-5.71429px, -6px, 0);
  opacity: 0;
}

.open-navigation .hamburger--slider .hamburger-inner::after {
  transform: translate3d(0, -20px, 0) rotate(-90deg);
}

.mainMenu {
  background-color: #000;
  margin-bottom: 0;
  padding: 0 5px;
}

.mainMenu a {
  display: block;
  color: #ccc;
  font-weight: 400;
  font-size: 18px;
  font-size: 1.125rem;
  letter-spacing: 0.4px;
  font-size: 16px;
  margin: 0;
  padding: 10px 0 5px 0;
  width: 100%;
  border-bottom: 3px solid #000;
  text-align: center;
}

.mainMenu a:hover {
  color: #fff;
  text-decoration: none;
  border-bottom: 3px solid #666;
}

@media screen and (min-width: 576px) {
  .mainMenu__container {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 1049;
  }
}

.mainMenu2022 {
  transition: opacity 0.3s ease-in-out;
}

.mainMenu2022 .navbar-dark {
  background-color: #000 !important;
}

.mainMenu2022 .navbar-dark .navbar-nav .nav-link {
  font-size: 16px;
  font-size: 1rem;
  color: #ddd;
}

.mainMenu2022 .navbar-dark .navbar-nav .nav-link:hover {
  color: #fff;
}

.mainMenu2022 .navbar-toggler {
  color: #fff;
}

.mainMenu2022 .navbar-toggler:focus {
  outline: none;
  box-shadow: none;
}

@media screen and (min-width: 769px) {
  .is-prepinned .mainMenu2022 {
    opacity: 0;
    pointer-events: none;
  }
}

.page-content {
  margin-top: 30px;
  position: relative;
}

.page-content__goal {
  box-shadow: 0 2px 5px 0px rgba(0, 0, 0, 0.3);
}

@media screen and (min-width: 769px) {
  .page-content__col {
    padding: 24px !important;
    padding-top: 0 !important;
  }
}

@media screen and (min-width: 1199px) {
  .page-content__col {
    padding: 38px !important;
    padding-top: 0 !important;
  }
}

.page-content .headline {
  display: block;
  font-weight: 400;
  font-size: 15px;
  color: #fff;
  background-color: #C74524;
  margin-left: 0;
  padding: 10px 20px;
  margin-bottom: 20px;
}

.content-2022 .page-content .headline {
  border-top: 2px solid #fff;
  border-bottom: 0px solid #fff;
  font-size: 32px;
  font-size: 2rem;
  background-color: #000;
  color: #fff;
  font-weight: bold;
}

.page-content .headline__goal {
  text-transform: uppercase;
  margin: 0;
}

.page-content h1 {
  border-bottom: 1px solid #A3A7AE;
}

.content-2022 .page-content {
  margin-top: 0;
}

.content-2022 .page-content__col {
  padding: 0 !important;
}

.next-page {
  text-align: right;
  margin-bottom: 100px;
}

.next-page a {
  margin-top: -20px;
  color: #000;
  padding: 20px 50px;
  position: relative;
}

.next-page a:after {
  content: '';
  width: 8px;
  height: 15px;
  position: absolute;
  right: 30px;
  bottom: calc(50% - 8px);
  background-image: url(/img/list-arrows.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 0 -82px;
}

.next-page a:hover:after {
  background-position: 0 -41px;
}

.pledge-count {
  background-image: url(/img/pledge-count-back.png);
  background-size: cover;
  background-position: center top;
}

.pledge-count h2 {
  font-size: 4em !important;
  line-height: 1em !important;
  font-weight: 300 !important;
}

.pledge-count p {
  font-size: 0.9em !important;
  font-weight: 300 !important;
}

.pledge-count:hover {
  text-decoration: none;
}

.explore-priority {
  transform: scale(1);
  transition: transform 0.1s ease;
  text-decoration: none;
}

.explore-priority:hover {
  text-decoration: none;
  transform: scale(1.03);
}

.explore-priority.growing-the-economy-and-jobs svg {
  color: #DC3A37;
}

.explore-priority.building-better-lives svg {
  color: #007748;
}

.explore-priority.fighting-corruption svg {
  color: #FEB81C;
}

.explore-priority.making-communities-safer svg {
  color: #001389;
}

.explore-priority.making-government-work svg {
  color: #000;
}

.quoteBlock--right {
  margin-left: 40px;
  margin-right: 40px;
  margin-top: -40px;
}

@media (min-width: 768px) {
  .quoteBlock--right {
    margin-left: -40px;
    margin-right: 0;
    margin-top: 0;
  }
}

.quoteBlock--left {
  margin-left: 40px;
  margin-right: 40px;
  margin-top: -40px;
}

@media (min-width: 768px) {
  .quoteBlock--left {
    margin-right: -40px;
    margin-left: 0;
    margin-top: 0;
  }
}

.z-0 {
  z-index: 0;
}

.z-1 {
  z-index: 1;
}

.hero-type .rfs-display {
  font-size: 32px;
  line-height: 1.1;
}

@media screen and (min-width: 376px) {
  .hero-type .rfs-display {
    font-size: calc(32px + 32 * ((100vw - 376px) / 924));
  }
}

@media screen and (min-width: 1300px) {
  .hero-type .rfs-display {
    font-size: 64px;
  }
}

.hero-type .rfs-h1 {
  font-size: 28px;
  line-height: 1.2;
}

@media screen and (min-width: 376px) {
  .hero-type .rfs-h1 {
    font-size: calc(28px + 28 * ((100vw - 376px) / 924));
  }
}

@media screen and (min-width: 1300px) {
  .hero-type .rfs-h1 {
    font-size: 56px;
  }
}

.hero-type .rfs-h2 {
  font-size: 24px;
  line-height: 1.2;
}

@media screen and (min-width: 376px) {
  .hero-type .rfs-h2 {
    font-size: calc(24px + 20 * ((100vw - 376px) / 924));
  }
}

@media screen and (min-width: 1300px) {
  .hero-type .rfs-h2 {
    font-size: 44px;
  }
}

.hero-type .rfs-h3 {
  font-size: 20px;
  line-height: 1.5;
}

@media screen and (min-width: 376px) {
  .hero-type .rfs-h3 {
    font-size: calc(20px + 16 * ((100vw - 376px) / 924));
  }
}

@media screen and (min-width: 1300px) {
  .hero-type .rfs-h3 {
    font-size: 36px;
  }
}

.hero-type .rfs-h4 {
  font-size: 18px;
  line-height: 1.5;
}

@media screen and (min-width: 376px) {
  .hero-type .rfs-h4 {
    font-size: calc(18px + 10 * ((100vw - 376px) / 924));
  }
}

@media screen and (min-width: 1300px) {
  .hero-type .rfs-h4 {
    font-size: 28px;
  }
}

.hero-type .rfs-h5 {
  font-size: 16px;
  line-height: 1.4;
}

@media screen and (min-width: 376px) {
  .hero-type .rfs-h5 {
    font-size: calc(16px + 8 * ((100vw - 376px) / 924));
  }
}

@media screen and (min-width: 1300px) {
  .hero-type .rfs-h5 {
    font-size: 24px;
  }
}

.hero-type .rfs-body-large {
  font-size: 18px;
  line-height: 1.5;
}

@media screen and (min-width: 376px) {
  .hero-type .rfs-body-large {
    font-size: calc(18px + 2 * ((100vw - 376px) / 924));
  }
}

@media screen and (min-width: 1300px) {
  .hero-type .rfs-body-large {
    font-size: 20px;
  }
}

.hero-type .rfs-body {
  font-size: 16px;
  line-height: 1.5;
}

@media screen and (min-width: 376px) {
  .hero-type .rfs-body {
    font-size: calc(16px + 2 * ((100vw - 376px) / 924));
  }
}

@media screen and (min-width: 1300px) {
  .hero-type .rfs-body {
    font-size: 18px;
  }
}

.hero-type .rfs-body-small {
  font-size: 14px;
  line-height: 1.5;
}

@media screen and (min-width: 376px) {
  .hero-type .rfs-body-small {
    font-size: calc(14px + 2 * ((100vw - 376px) / 924));
  }
}

@media screen and (min-width: 1300px) {
  .hero-type .rfs-body-small {
    font-size: 16px;
  }
}

.hero-type .rfs-caption {
  font-size: 12px;
  line-height: 1.5;
}

@media screen and (min-width: 376px) {
  .hero-type .rfs-caption {
    font-size: calc(12px + 2 * ((100vw - 376px) / 924));
  }
}

@media screen and (min-width: 1300px) {
  .hero-type .rfs-caption {
    font-size: 14px;
  }
}

.splash {
  width: 90%;
  display: block;
  height: calc(100vh - 255px);
  margin-top: 100px;
  max-height: 600px;
  background-image: url(/img/splash-1.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  max-width: 808px;
  margin: 0 auto;
}

.social-links a {
  opacity: 0.4;
  display: block;
  transform: scale(0.9);
  filter: grayscale(1);
  transition: all 0.3s ease-in-out;
}

.social-links a:hover {
  opacity: 1;
  transform: scale(1);
  filter: grayscale(0) brightness(1);
}

.social-links--light a {
  opacity: 0.6;
  filter: grayscale(1) brightness(3);
}

.timeline h2 {
  margin-top: 1em;
  margin-bottom: 1em;
  font-weight: bold;
}

.timeline h3 {
  font-size: 21px;
  margin-bottom: 1em;
  font-weight: 600;
}

.timeline a {
  color: #d46d52;
}

@media screen and (min-width: 576px) {
  .timeline {
    margin-top: 20px;
  }
}

#proverb {
  text-align: center;
  background-color: #fff;
  box-shadow: 0 0 10px -2px rgba(0, 0, 0, 0.4);
  padding: 15px 10px 15px 10px;
  margin-bottom: 60px;
}

#proverb h2 {
  padding-top: 10px;
  display: block;
  font-size: 14px;
}

#proverb p {
  font-size: 24px;
  letter-spacing: 0.02em;
}

.progress-wrap {
  background-size: cover;
  background-position: right;
}

.story-card:hover {
  transform: scale(1.02);
  text-decoration: none;
  border: 1px solid #999;
  background-color: #f0efd1;
}

.story-card:hover .text-muted {
  color: #000 !important;
}

.impact__image {
  width: 150px;
  flex-shrink: 0;
}

.impact__image img {
  max-width: 100%;
}

.impact-image img {
  border-radius: 20px;
}

.story-list li a {
  display: block;
  color: #777;
  text-decoration: none;
  position: relative;
}

.story-list li a:hover {
  background-color: #f0efd1;
  color: #000;
}

.story-list li a.active {
  background-color: #efefef;
  color: #000;
}

.story-list li a.active:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 4px;
  height: 100%;
  background-color: #000;
}

.ticker__label {
  margin-top: 4px;
  background-color: 1;
  position: relative;
  text-transform: uppercase;
}

.ticker__label:before {
  content: '';
  position: absolute;
  top: 0;
  left: 100%;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 20px 0 20px 23px;
  border-color: transparent transparent transparent #FFC108;
}

.ticker__label h2 {
  font-size: 18px;
  line-height: 38px;
  padding-top: 2px;
  font-weight: bold;
  margin: 0;
}

.ticker__content {
  display: flex;
  justify-content: middle;
  align-items: center;
}

.ticker__content a {
  padding-top: 4px;
  padding-left: 40px;
  font-size: 20px;
  line-height: 40px;
  color: #016631;
  font-weight: medium;
}

.modal-dialog {
  max-width: 800px;
  margin: 30px auto;
}

.modal-body {
  position: relative;
  padding: 0px;
}

.video-modal {
  cursor: pointer;
  width: 100%;
}

.video-modal__image {
  position: relative;
  padding-bottom: 55%;
  background-position: center;
  background-size: cover;
}

.video-modal__image:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #000;
  opacity: 0.5;
  transition: opacity 0.2s ease-in-out;
}

.video-modal__image:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0.8;
  transition: all 0.2s ease-in-out;
  background-image: url(/img/play-shape.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 68px 63px;
}

.video-modal__image:hover:before {
  opacity: 0.25;
}

.video-modal__image:hover:after {
  transition: all 0.1s;
  opacity: 0.9;
  background-size: 78px 73px;
}

.video-modal__feature-container {
  width: 100%;
}

@media screen and (min-width: 769px) {
  .video-modal__feature-container {
    width: 48%;
    float: right;
    margin: -20px 0 3px 20px;
  }
}

.video-modal__caption p {
  font-size: 13px;
  font-size: 0.8125rem;
  color: #888;
}

.close {
  position: absolute;
  right: -30px;
  top: 0;
  z-index: 999;
  font-size: 2rem;
  font-weight: normal;
  color: #fff;
  opacity: 1;
}

.videoframe {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
}

.videoframe__holder {
  position: relative;
  width: 100%;
  padding-bottom: 56.5%;
}

.videoframe {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
}

.videoframe__holder {
  position: relative;
  width: 100%;
  padding-bottom: 56.5%;
}

.investmentVideo {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
}

.investmentVideo__bar {
  height: 160px;
  background-color: #E6E5E5;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
}

.investmentVideo__container {
  position: relative;
}

.investmentVideo__wrapper {
  position: relative;
  width: 95%;
  max-width: 800px;
  padding-bottom: 56.5%;
  margin: 0 auto;
}

.text-block li {
  padding-bottom: 4px;
}

.text-block p {
  font-size: 15px;
  font-size: 0.9375rem;
}

.page_reply-by-president-cyril-ramaphosa-to-the-debate-on-the-state-of-the-nation-address h3 {
  margin-top: 40px;
  margin-bottom: 15px;
}

.style--h2 {
  background-color: rgba(0, 0, 0, 0.1);
}

.headlineRow h2 {
  text-transform: uppercase;
  margin: 15px 0;
}

.headlineRow h3 {
  border-left: 15px solid rgba(0, 0, 0, 0.1);
  padding: 15px 0 15px 20px;
  text-transform: uppercase;
}

.headlineLink {
  display: inline-block;
  background-color: rgba(0, 0, 0, 0.1);
  padding: 10px 20px;
  color: #000;
  margin-bottom: 30px;
  border-radius: 5px;
  transition: background-color 0.3s ease-in-out;
}

.headlineLink:not(:last-of-type) {
  margin-right: 20px;
}

.headlineLink:hover {
  background-color: rgba(0, 0, 0, 0.2);
  text-decoration: none;
  color: #000;
}

.headlineLink--dark {
  background-color: #FFF;
  border: 1px solid #ccc;
}

.headlineLink--dark:hover {
  text-decoration: none;
  background-color: #FFF;
  border: 1px solid #999;
}

.textBlockRow p {
  font-size: 1.2em;
}

.textBlockRow .center-list ul {
  margin: 0 auto;
  max-width: 700px;
}

.textBlockRow ul {
  width: 98%;
  list-style: none;
  padding: 0 0 0 30px;
}

.textBlockRow ul li {
  position: relative;
  margin-bottom: 15px;
  font-size: 17px !important;
}

.textBlockRow ul li p {
  font-size: 17px !important;
}

.textBlockRow ul li:before {
  content: '';
  position: absolute;
  top: 8px;
  left: -22px;
  background-color: #000;
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 30px;
}

.quote-block {
  margin: 20px 0;
  border-left: 3px solid #C74524;
  padding-top: 3px;
  padding-left: 30px;
  margin-left: 20px;
}

.quote-block blockquote:before {
  content: "\201C";
  margin-left: -20px;
}

.quote-block blockquote:after {
  content: "\201D";
}

.quote-block blockquote:before, .quote-block blockquote:after {
  display: inline-block;
  transform: translateY(10px);
  color: #777;
  font-size: 35px;
  font-size: 2.1875rem;
  line-height: 15px;
}

.quote-block blockquote p {
  display: inline;
  font-size: 15px;
  font-size: 0.9375rem;
}

.quote-block__source {
  font-size: 13px;
  font-size: 0.8125rem;
  margin-top: -10px;
  margin-right: 20px;
  color: #000;
}

.page_reply-by-president-cyril-ramaphosa-to-the-debate-on-the-state-of-the-nation-address .quote-block {
  margin: 30px 0;
  border-left: none;
  padding-top: 3px 10px;
  text-align: center;
}

.page_reply-by-president-cyril-ramaphosa-to-the-debate-on-the-state-of-the-nation-address .quote-block blockquote:before, .page_reply-by-president-cyril-ramaphosa-to-the-debate-on-the-state-of-the-nation-address .quote-block blockquote:after {
  content: none;
  transform: translateY(30px);
  font-size: 65px;
  font-size: 4.0625rem;
  line-height: 5px;
}

.page_reply-by-president-cyril-ramaphosa-to-the-debate-on-the-state-of-the-nation-address .quote-block blockquote p {
  font-size: 20px;
  font-size: 1.25rem;
}

.page_reply-by-president-cyril-ramaphosa-to-the-debate-on-the-state-of-the-nation-address .quote-block__source {
  display: block;
  text-align: right;
}

.quote-block-2022 {
  margin: 0 45px;
  background-color: #eee5d0;
  position: relative;
  padding: 30px 20px 30px 50px;
  min-height: 150px;
}

@media (min-width: 768px) {
  .quote-block-2022 {
    margin: 0 0 0 91px;
    padding: 58px 50px 58px 90px;
    min-height: 222px;
  }
}

.quote-block-2022:before {
  content: '';
  position: absolute;
  top: 0;
  left: -45px;
  width: 186px;
  height: 111px;
  display: block;
  pointer-events: none;
  background-image: url("../assets/quote_swish_2x.png");
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 0;
}

@media (min-width: 768px) {
  .quote-block-2022:before {
    left: -91px;
    width: 372px;
    height: 222px;
  }
}

.quote-block-2022__content {
  font-weight: 600;
}

.quote-block-2022 p,
.quote-block-2022 a {
  font-style: italic;
  margin: 0;
  color: #000;
}

.quote-block-2022__source {
  font-style: italic;
  font-size: 1.3em;
  font-weight: normal;
  margin: 0;
  color: #000;
}

.bracket-block-2022 {
  margin: 40px auto;
  text-align: center;
  max-width: 1200px;
  width: 95%;
  position: relative;
  padding: 25px 75px;
}

.bracket-block-2022:before, .bracket-block-2022:after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  width: 60px;
  border: 10px solid #dfcca1;
}

.bracket-block-2022:before {
  left: 0;
  border-right: 0px;
}

.bracket-block-2022:after {
  right: 0;
  border-left: 0px;
}

.bracket-block-2022 a {
  color: #dfcca1;
  display: inline-block;
  cursor: pointer;
}

.bracket-block-2022 a:hover {
  text-decoration: none;
  color: #dfcca1;
}

.bracket-block-2022 .bracket-block-2022__source {
  max-width: 900px;
  margin: 0 auto;
}

.milestone {
  margin: 40px 0 25px 0;
  position: relative;
}

.milestone p {
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: bold;
  color: #333;
}

.milestone p b, .milestone p strong {
  color: #444;
}

@media screen and (min-width: 576px) {
  .milestone {
    padding-left: 150px;
  }
  .milestone p {
    max-width: 75%;
  }
}

.milestone__day {
  display: block;
  width: 125px;
  background-color: #C74524;
  line-height: 32px;
  padding: 0 10px;
  text-align: center;
  font-weight: 400;
  font-size: 15px;
  font-size: 0.9375rem;
  color: #fff;
  border-radius: 3px;
  margin-bottom: 15px;
}

@media screen and (min-width: 576px) {
  .milestone__day {
    position: absolute;
    left: 0;
    top: 0px;
  }
  .milestone__day:before {
    display: block;
    height: 2px;
    width: 40px;
    background-color: #C74524;
    position: absolute;
    top: 15px;
    right: 100%;
  }
}

.mediaBlock {
  margin: 20px 0 0;
  position: relative;
  display: inline-block;
  width: 100%;
}

.mediaBlock p {
  margin: 0;
}

.mediaBlock_Title {
  font-size: 20px;
  font-size: 1.25rem;
  line-height: initial;
  color: #C74524;
  transition: background-color 0.2s ease-in-out;
}

.mediaBlock_Source {
  font-size: 14px;
  font-size: 0.875rem;
  color: #A3A7AE;
}

@media screen and (min-width: 576px) {
  .mediaBlock {
    padding-left: 150px;
  }
  .mediaBlock p {
    max-width: 80%;
  }
}

.mediaBlock_Date {
  display: block;
  width: 135px;
  background-color: #C74524;
  color: #fff;
  line-height: 32px;
  padding: 0 10px;
  text-align: center;
  font-weight: 700;
  font-size: 13px;
  font-size: 0.8125rem;
  border-radius: 3px;
  margin-bottom: 15px;
  transition: background-color 0.2s ease-in-out;
}

@media screen and (min-width: 576px) {
  .mediaBlock_Date {
    position: absolute;
    left: 0;
    top: 0px;
  }
}

.mediaBlock:hover {
  text-decoration: none;
}

.mediaBlock:hover .mediaBlock_Date {
  background-color: #e4856d;
}

.mediaBlock:hover .mediaBlock_Title {
  color: #e4856d;
}

.mediaBlock-2022 {
  border-radius: 5px;
  overflow: hidden;
}

.mediaBlock-2022_Date {
  background-color: #c7c7c7;
  color: #fff;
  width: 100%;
  min-height: 200px;
  flex-shrink: 0;
  flex-grow: 0;
  background-size: cover;
  background-position: top left;
}

@media screen and (min-width: 576px) {
  .mediaBlock-2022_Date {
    width: 300px;
  }
}

.mediaBlock-2022_Details {
  background-color: #fff;
  border-radius: 0 5px 5px 0;
  transition: background 0.3s ease-in-out;
}

.mediaBlock-2022_Title {
  font-size: 1.3em !important;
  font-weight: bold;
  line-height: initial;
  color: #000;
}

.mediaBlock-2022_Source {
  font-size: 14px;
  font-size: 0.875rem;
  color: #A3A7AE;
}

.mediaBlock-2022_Excerpt p {
  color: #666 !important;
}

.mediaBlock-2022:hover {
  text-decoration: none;
}

.mediaBlock-2022:hover .mediaBlock-2022_Details {
  background-color: #efefef;
}

.investmentPage .mediaBlock-2022 {
  border-radius: 5px;
  overflow: hidden;
}

.investmentPage .mediaBlock-2022_Date {
  background-color: #c7c7c7;
  color: #fff;
  width: 100%;
  min-height: 200px;
  flex-shrink: 0;
  flex-grow: 0;
  background-size: cover;
  background-position: top left;
}

@media screen and (min-width: 576px) {
  .investmentPage .mediaBlock-2022_Date {
    width: 300px;
  }
}

.investmentPage .mediaBlock-2022_Details {
  background-color: #fff;
  border-radius: 0 5px 5px 0;
  transition: background 0.3s ease-in-out;
}

.investmentPage .mediaBlock-2022_Title {
  font-size: 1.3em !important;
  font-weight: bold;
  line-height: initial;
  color: #000;
}

.investmentPage .mediaBlock-2022_Source {
  font-size: 14px;
  font-size: 0.875rem;
  color: #A3A7AE;
}

.investmentPage .mediaBlock-2022_Excerpt p {
  color: #666 !important;
}

.investmentPage .mediaBlock-2022:hover {
  text-decoration: none;
}

.investmentPage .mediaBlock-2022:hover .mediaBlock-2022_Details {
  background-color: #efefef;
}

.media-block {
  margin-bottom: 15px;
}

.media-block__image {
  display: block;
  width: 70px;
  height: 70px;
  margin-right: 10px;
  background-color: #019D4E;
  background-size: cover;
  background-position: center;
}

.media-block__content {
  width: calc(100% - 80px);
}

.media-block__content h2 {
  font-size: 16px;
  line-height: 17px;
  margin-bottom: 0;
  font-weight: 600;
}

.media-block__date {
  font-size: 12px;
  line-height: 12px;
  text-transform: uppercase;
  opacity: 0.8;
}

.media-block a {
  color: #000;
  text-decoration: none;
}

.media-block a:hover {
  color: #013319;
}

.media-item {
  padding-bottom: 100%;
  position: relative;
  color: #fff;
  background-position: center top;
  background-size: 140%;
  background-repeat: no-repeat;
}

.media-item:hover {
  color: #fff;
}

.media-item:hover .media-item__content {
  background-color: #016631;
}

.media-item:hover .media-item__content:after {
  border-color: transparent transparent #016631 transparent;
}

.media-item--image {
  background-size: 100%;
}

.media-item__content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 30%;
  background-color: #019D4E;
  transition: all 0.3s;
  line-height: 18px;
  font-size: 16px;
  text-align: center;
}

.media-item__content:after {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 80%;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 15px 16px 15px;
  border-color: transparent transparent #019D4E transparent;
  transition: all 0.3s;
}

.media-twitter {
  position: absolute;
  top: 0;
  left: 0;
  right: 10px;
  bottom: 16px;
  overflow: hidden;
}

.media-twitter .timeline-Widget {
  max-width: 245px;
}

.stats .card {
  border-color: #019D4E;
  box-shadow: -2px 2px 0 rgba(157, 78, 1, 0.2);
  border-radius: 2px !important;
}

.bn-breaking-news {
  background-color: #009d4e;
  border: none;
  box-shadow: -2px 2px 0 rgba(157, 78, 1, 0.2);
  border-radius: 2px !important;
}

.bn-breaking-news li h4 {
  line-height: 50px;
  text-transform: uppercase;
  font-weight: bold;
  color: #90e106;
  padding: 0 10px;
}

.twitter2022 .twitter-tweet.twitter-tweet-rendered {
  margin: 0 auto;
}

.home-feature {
  border: 1px solid #efefef;
  background-color: #fff;
  height: 100%;
  box-shadow: 0 0 15px -3px rgba(0, 0, 0, 0.2);
}

.home-feature__image {
  background-color: #363636;
}

.home-feature__headline {
  background-color: #016631;
}

.home-feature__headline a {
  height: 100%;
  padding: 15px;
  position: relative;
  text-decoration: none;
}

.home-feature__headline a:after {
  content: '';
  position: absolute;
  top: 40%;
  right: 100%;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 20px 23px 20px 0;
  border-color: transparent #016631 transparent transparent;
}

.home-feature__headline h1 {
  color: #fff;
}

.LinkList {
  list-style: none;
  margin: 0;
  padding: 0;
}

.LinkList a {
  color: #d46d52;
  display: inline-block;
  padding: 3px 0;
  font-size: 14px;
  font-size: 0.875rem;
}

.linkBox {
  transform: scale(1);
  box-shadow: 0 0 15px -5px rgba(0, 0, 0, 0);
  transition: transform 0.2s ease-in-out, box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out;
}

.linkBox:hover {
  transform: scale(1.03);
  box-shadow: 0 0 15px -5px rgba(0, 0, 0, 0.25);
  border-color: #999 !important;
  text-decoration: none;
}

.imageBlock {
  padding: 0;
  max-width: 95%;
  margin: 0 auto;
}

.imageBlock.w-100 {
  max-width: 100%;
}

.imageBlock--half-width {
  width: 100%;
}

@media screen and (min-width: 768px) {
  .imageBlock--half-width {
    width: 50%;
  }
}

.imageBlockWrapper {
  margin: 0 auto;
  display: table;
}

.imageBlockContainer {
  position: relative;
  display: inline-block;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}

.imageBlockContainer img {
  max-width: 100%;
}

.imageBlockContainer .imageSourceLink, .imageBlockContainer .imageSourceText {
  position: absolute;
  bottom: 0;
  right: 0;
  background-color: #000;
  padding: 0 5px;
  color: #fff;
  font-size: 14px;
  margin: 0;
}

.imageBlockContainer .imageSourceLink:hover {
  color: #C74524;
}

.imageCaption {
  margin-top: 10px;
  font-size: 13px;
  font-size: 0.8125rem;
  color: #666;
  display: table-caption;
  caption-side: bottom;
}

.imageCaption .imageUrlLink {
  float: right;
  padding: 3px 10px;
  border-radius: 3px;
  border: 2px solid #eee;
  background-color: #efefef;
  text-transform: uppercase;
  margin-left: 10px;
  margin-bottom: 10px;
  width: 170px;
  text-align: center;
  color: #DC3A37;
  font-weight: 600;
}

.imageCaption .imageUrlLink:hover {
  color: #a42b29;
}

.imageLinkBlock {
  display: block;
  position: relative;
  width: 100%;
  padding: 75% 0 0 0;
  overflow: hidden;
}

.imageLinkBlock__image {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  transform-origin: center;
  transform: scale(1.01);
  transition: transform 0.8s ease-in;
}

.imageLinkBlock__content {
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(0, 0, 0, 0.55);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  font-size: 18px;
  font-size: 1.125rem;
}

.imageLinkBlock__content p {
  font-size: 1em;
}

.imageLinkBlock__content--noblur {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.imageLinkBlock__linkless .imageLinkBlock__content {
  font-size: 28px;
  font-size: 1.75rem;
  top: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

.imageLinkBlock:not(.imageLinkBlock__linkless):hover .imageLinkBlock__image {
  transition: transform 0.4s;
  transform: scale(1.05);
}

.cover-image {
  -o-object-fit: cover;
  object-fit: cover;
}

.icon {
  display: block;
  width: 44px;
  height: 44px;
  padding: 5px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 70%;
}

.icon-facebook {
  background-image: url(/site/themes/sona/assets/square-facebook-brands.svg);
}

.icon-twitter {
  background-image: url(/site/themes/sona/assets/square-twitter-brands.svg);
}

.icon-linkedin {
  background-image: url(/site/themes/sona/assets/linkedin-brands.svg);
}

.icon__row li:not(:first-child) {
  transition: transform 0.2s;
  transform: scale(1);
}

.icon__row li:not(:first-child):hover {
  transform: scale(1.1);
}

.footerLink {
  display: block;
  margin-top: 15px;
  padding: 5px 10px;
  border-radius: 3px;
  background-color: #C74524;
  opacity: 0.9;
  text-align: center;
  font-size: 16px;
  font-size: 1rem;
  color: #fff;
}

.footerLink:hover {
  opacity: 1;
  color: #fff;
}

.back-to-top {
  position: fixed;
  bottom: 30px;
  right: 30px;
  padding: 10px;
  border-radius: 5px;
  z-index: 1000;
  opacity: 0;
  transition: all 0.3s ease;
}

.not-top .back-to-top {
  opacity: 1;
  pointer-events: auto;
}

.goalsHeading {
  font-weight: 600;
  margin: 20px 0;
  font-size: 28px;
  font-size: 1.75rem;
}

.goalsHeading__image {
  min-width: 100px;
  width: 100px;
  margin-right: 20px;
}

@media screen and (min-width: 769px) {
  .goalsHeading {
    font-size: 36px;
    font-size: 2.25rem;
  }
}

.goalInfoBlock {
  padding-left: 40px;
  position: relative;
}

.goalInfoBlock__heading {
  background-color: #000;
  color: #fff;
  font-size: 18px;
  font-size: 1.125rem;
  padding: 7px 5px 4px 7px;
  text-transform: uppercase;
  border-radius: 4px;
}

.goalInfoBlock__content {
  padding-left: 5px;
}

.goalInfoBlock__content ul {
  padding: 0 0 0 10px;
  list-style: none;
}

.goalInfoBlock__content ul li {
  position: relative;
}

.goalInfoBlock__content ul li:before {
  content: '';
  display: block;
  position: absolute;
  top: 7px;
  left: -10px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #000;
}

.goalInfoBlock__image {
  max-width: 30px;
  position: absolute;
  top: 0;
  left: 3px;
  fill: #000;
}

@media screen and (min-width: 992px) {
  .goalInfoBlock__borderCol {
    border-right: 1px solid #efe7d5;
    padding-right: 20px !important;
  }
  .goalInfoBlock__spacerCol {
    padding-left: 20px !important;
  }
}

.goalInfoBlock--red .goalInfoBlock__heading {
  background-color: #dc3a37;
}

.goalInfoBlock--red .goalInfoBlock__image {
  fill: #dc3a37;
}

.goalInfoBlock--green .goalInfoBlock__heading {
  background-color: #107850;
}

.goalInfoBlock--green .goalInfoBlock__image {
  fill: #107850;
}

.goalInfoBlock--blue .goalInfoBlock__heading {
  background-color: #283888;
}

.goalInfoBlock--blue .goalInfoBlock__image {
  fill: #283888;
}

.goalInfoBlock--yellow .goalInfoBlock__heading {
  background-color: #f9b22d;
}

.goalInfoBlock--yellow .goalInfoBlock__image {
  fill: #f9b22d;
}

.goalFooter {
  color: #7e7e7e;
}

.noLink {
  pointer-events: none;
}

.videoContainer {
  min-height: 486px;
}

#twitter-widget-0 {
  height: auto;
}

.poemContainer {
  background-color: #333;
  max-height: 486px;
}

.poemContainer:after {
  content: '';
  position: absolute;
  top: 70%;
  left: 0;
  bottom: 0;
  right: 0;
  pointer-events: none;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+1,000000+100&0+21,0.8+100 */
  /* FF3.6-15 */
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 1%, rgba(0, 0, 0, 0.8) 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000',GradientType=0 );
  /* IE6-9 */
}

.poemHolder {
  max-height: 100%;
  overflow: scroll;
  padding: 20px 40px;
  padding-top: 20%;
  padding-bottom: 20%;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.poemHolder p {
  color: #bbb;
  margin: 0;
  line-height: 30px;
  font-size: 18px;
  font-size: 1.125rem;
}

.homeblock__feature .homeblock__inner {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.homeblock__feature .homeblock__inner:hover .homeblock__img {
  transform: scale(1.05);
}

.homeblock__feature .homeblock__inner:hover .homeblock__content-wrap--green {
  background-color: #107850;
}

.homeblock__feature .homeblock__img {
  display: block;
  padding-bottom: 25vw;
  min-height: 486px;
  background-size: cover;
  background-position: center;
  transform: scale(1);
  transition: transform 0.3s ease-in-out;
}

.homeblock__feature .homeblock__content {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
}

.homeblock__feature .homeblock__content h2, .homeblock__feature .homeblock__content p {
  margin: 0;
  padding: 0;
}

.homeblock__feature .homeblock__content p {
  font-size: calc(15px + 0.2vw);
  line-height: calc(18px + 0.2vw);
  margin: 10px 0;
}

.homeblock__feature .homeblock__content h2 {
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 1px;
}

.homeblock__feature .homeblock__content-wrap {
  padding: 20px;
  width: 50%;
  min-width: 50%;
  color: #fff;
  font-family: Arial,Helvetica Neue,Helvetica,sans-serif;
  transition: background 0.5s;
}

.homeblock__feature .homeblock__content-wrap--green {
  background-color: rgba(16, 120, 80, 0.8);
}

.homeblock__feature .homeblock__number {
  font-size: calc(35px + 2vw);
  line-height: calc(30px + 2vw);
}

.homeblock__basic .homeblock__inner {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.homeblock__basic .homeblock__inner:hover .homeblock__img {
  transform: scale(1.05);
}

.homeblock__basic .homeblock__inner:hover .homeblock__content-wrap--green {
  background-color: #107850;
}

.homeblock__basic .homeblock__img {
  display: block;
  padding-bottom: 25vw;
  min-height: 486px;
  background-size: cover;
  background-position: center;
  transform: scale(1);
  transition: transform 0.3s ease-in-out;
}

.homeblock__basic .homeblock__content {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
}

.homeblock__basic .homeblock__content h2, .homeblock__basic .homeblock__content p {
  margin: 0;
  padding: 0;
}

.homeblock__basic .homeblock__content p {
  font-size: calc(15px + 0.2vw);
  line-height: calc(18px + 0.2vw);
  margin: 10px 0;
}

.homeblock__basic .homeblock__content h2 {
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 1px;
}

.homeblock__basic .homeblock__content-wrap {
  padding: 20px;
  width: 50%;
  min-width: 50%;
  color: #fff;
  font-family: Arial,Helvetica Neue,Helvetica,sans-serif;
  transition: background 0.5s;
}

.homeblock__basic .homeblock__content-wrap--green {
  background-color: rgba(16, 120, 80, 0.8);
}

.homeblock__basic .homeblock__number {
  font-size: calc(35px + 2vw);
  line-height: calc(30px + 2vw);
}

.homeblock__basicSlim .homeblock__inner {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.homeblock__basicSlim .homeblock__inner:hover .homeblock__img {
  transform: scale(1.05);
}

.homeblock__basicSlim .homeblock__inner:hover .homeblock__content-wrap--green {
  background-color: #107850;
}

.homeblock__basicSlim .homeblock__img {
  display: block;
  padding-bottom: 25vw;
  min-height: 486px;
  background-size: cover;
  background-position: center;
  transform: scale(1);
  transition: transform 0.3s ease-in-out;
}

.homeblock__basicSlim .homeblock__content {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
}

.homeblock__basicSlim .homeblock__content h2, .homeblock__basicSlim .homeblock__content p {
  margin: 0;
  padding: 0;
}

.homeblock__basicSlim .homeblock__content p {
  font-size: calc(15px + 0.2vw);
  line-height: calc(18px + 0.2vw);
  margin: 10px 0;
}

.homeblock__basicSlim .homeblock__content h2 {
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 1px;
}

.homeblock__basicSlim .homeblock__content-wrap {
  padding: 20px;
  width: 50%;
  min-width: 50%;
  color: #fff;
  font-family: Arial,Helvetica Neue,Helvetica,sans-serif;
  transition: background 0.5s;
}

.homeblock__basicSlim .homeblock__content-wrap--green {
  background-color: rgba(16, 120, 80, 0.8);
}

.homeblock__basicSlim .homeblock__number {
  font-size: calc(35px + 2vw);
  line-height: calc(30px + 2vw);
}

.homeblock__side .homeblock__inner {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.homeblock__side .homeblock__inner:hover .homeblock__img {
  transform: scale(1.05);
}

.homeblock__side .homeblock__inner:hover .homeblock__content-wrap--green {
  background-color: #107850;
}

.homeblock__side .homeblock__img {
  display: block;
  padding-bottom: 45%;
  min-height: 243px;
  background-size: cover;
  background-position: center;
  transform: scale(1);
  transition: transform 0.3s ease-in-out;
}

.homeblock__side .homeblock__content {
  position: absolute;
  left: 0;
  bottom: 0;
  top: 0;
  width: 100%;
}

.homeblock__side .homeblock__content h2, .homeblock__side .homeblock__content p {
  margin: 0;
  padding: 0;
}

.homeblock__side .homeblock__content p {
  font-size: calc(15px + 0.2vw);
  line-height: calc(18px + 0.2vw);
  margin: 10px 0;
}

.homeblock__side .homeblock__content h2 {
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 1px;
}

.homeblock__side .homeblock__content-wrap {
  padding: 20px;
  width: 50%;
  height: 100%;
  color: #fff;
  font-family: Arial,Helvetica Neue,Helvetica,sans-serif;
  transition: background 0.5s;
}

.homeblock__side .homeblock__number {
  font-size: calc(35px + 2vw);
  line-height: calc(30px + 2vw);
}

.homeblock__side.side--red:after, .homeblock__side.side--yellow:after {
  content: '';
  border: solid transparent;
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  margin-top: -25px;
}

.homeblock__side.side--red:after {
  border-right-color: rgba(213, 0, 0, 0);
  border-right-color: #DC3A37;
  border-right-width: 25px;
  border-top-width: 25px;
  border-bottom-width: 25px;
  right: 50%;
  bottom: 25%;
}

.homeblock__side.side--red .homeblock__content-wrap {
  background-color: #DC3A37;
}

.homeblock__side.side--yellow:after {
  border-left-color: rgba(213, 0, 0, 0);
  border-left-color: #F9B22D;
  border-left-width: 25px;
  border-top-width: 25px;
  border-bottom-width: 25px;
  left: 50%;
  bottom: 25%;
}

.homeblock__side.side--yellow .homeblock__content-wrap {
  background-color: #F9B22D;
}

.homeblock__side.side--left .homeblock__content-wrap {
  left: 0;
  right: auto;
}

.homeblock__side.side--right .homeblock__content-wrap {
  float: right;
}

.homeblock__tall .homeblock__inner {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.homeblock__tall .homeblock__inner:hover .homeblock__img {
  transform: scale(1.05);
}

.homeblock__tall .homeblock__inner:hover .homeblock__content-wrap--green {
  background-color: #107850;
}

.homeblock__tall .homeblock__img {
  display: block;
  padding-bottom: 15vw;
  min-height: 400px;
  background-size: cover;
  background-position: center;
  transform: scale(1);
  transition: transform 0.3s ease-in-out;
}

.homeblock__tall .homeblock__content {
  position: absolute;
  left: 0;
  bottom: 0;
  top: 0;
  width: 100%;
}

.homeblock__tall .homeblock__content h2, .homeblock__tall .homeblock__content p {
  margin: 0;
  padding: 0;
}

.homeblock__tall .homeblock__content p {
  font-size: calc(15px + 0.2vw);
  line-height: calc(18px + 0.2vw);
  margin: 10px 0;
}

.homeblock__tall .homeblock__content h2 {
  text-transform: uppercase;
  font-weight: bold;
  margin-bottom: 25px;
  letter-spacing: 1px;
}

.homeblock__tall .homeblock__content-wrap {
  padding: 20px;
  width: 100%;
  height: 80%;
  color: #fff;
  font-family: Arial,Helvetica Neue,Helvetica,sans-serif;
  transition: background 0.5s;
}

.homeblock__tall .homeblock__number {
  font-size: calc(35px + 2vw);
  line-height: calc(30px + 2vw);
}

.homeblock__tall .homeblock__head {
  display: inline-block;
  margin: 20px;
  color: #fff;
  background-color: #000;
  padding: 5px 10px;
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 18px;
  min-width: 150px;
}

.homeblock__tall.blueBlock .homeblock__inner {
  background-color: #283888;
}

.homeblock__tall.blackBlock .homeblock__inner {
  background-color: #000;
}

.homeblock__tall.yellowHead .homeblock__head {
  color: #000;
  background-color: #F9B22D;
}

.homeblock__tall.whiteHead .homeblock__head {
  color: #000;
  background-color: #fff;
}

.homeblock__tall.redHead .homeblock__head {
  color: #fff;
  background-color: #DC3A37;
}

.homeblock__tall.blurpBottom .homeblock__content-wrap {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.homeblock__tall.largeNumber .homeblock__content-wrap {
  padding: 20px 45px;
}

.homeblock__tall.largeNumber .homeblock__number {
  font-size: calc(45px + 5vw);
  line-height: calc(45px + 2vw);
  text-align: center;
  display: block;
  margin-bottom: 20px;
  margin-top: 20px;
}

.homeblock__tall.twitter .homeblock__content-wrap {
  padding: 20px;
}

.homeblock__tall.twitter .homeblock__number {
  font-size: calc(45px + 5vw);
  line-height: calc(45px + 2vw);
  text-align: center;
  display: block;
  margin-bottom: 20px;
}

.homeblock__tallhalf .homeblock__inner {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.homeblock__tallhalf .homeblock__inner:hover .homeblock__img {
  transform: scale(1.05);
}

.homeblock__tallhalf .homeblock__inner:hover .homeblock__content-wrap--green {
  background-color: #107850;
}

.homeblock__tallhalf .homeblock__img {
  display: block;
  padding-bottom: 15vw;
  min-height: 400px;
  background-size: cover;
  background-position: center;
  transform: scale(1);
  transition: transform 0.3s ease-in-out;
}

.homeblock__tallhalf .homeblock__content {
  position: absolute;
  left: 0;
  bottom: 0;
  top: 0;
  width: 100%;
}

.homeblock__tallhalf .homeblock__content h2, .homeblock__tallhalf .homeblock__content p {
  margin: 0;
  padding: 0;
}

.homeblock__tallhalf .homeblock__content p {
  font-size: calc(15px + 0.2vw);
  line-height: calc(18px + 0.2vw);
  margin: 10px 0;
}

.homeblock__tallhalf .homeblock__content h2 {
  text-transform: uppercase;
  font-weight: bold;
  margin-bottom: 25px;
  letter-spacing: 1px;
}

.homeblock__tallhalf .homeblock__content-wrap {
  padding: 20px;
  width: 100%;
  height: 50%;
  color: #fff;
  font-family: Arial,Helvetica Neue,Helvetica,sans-serif;
  transition: background 0.5s;
}

.homeblock__tallhalf .homeblock__number {
  font-size: calc(35px + 2vw);
  line-height: calc(30px + 2vw);
}

.homeblock__tallhalf .homeblock__head {
  display: inline-block;
  margin: 20px;
  color: #fff;
  background-color: #000;
  padding: 5px 10px;
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 18px;
  min-width: 150px;
}

.homeblock__tallhalf.top-half:after, .homeblock__tallhalf.bottom-half:after {
  content: '';
  border: solid transparent;
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

.homeblock__tallhalf.bottom-half .homeblock__content-wrap {
  position: relative;
  top: 50%;
}

.homeblock__tallhalf.bottom-half:after {
  top: 50%;
}

.homeblock__tallhalf.side--black.arrowdown:after {
  border-top-color: #000;
  border-top-width: 25px;
  border-left-width: 25px;
  border-right-width: 25px;
  left: 7%;
  top: 50%;
}

.homeblock__tallhalf.side--black .homeblock__content-wrap {
  background-color: #000;
}

.homeblock__tallhalf.side--white.arrowup:after {
  border-bottom-color: #fff;
  border-bottom-width: 25px;
  border-left-width: 25px;
  border-right-width: 25px;
  left: 7%;
  top: calc(50% - 25px);
}

.homeblock__tallhalf.side--white .homeblock__content-wrap {
  background-color: #fff;
  color: #000;
}

.announcement__container {
  background-color: #763f3f;
  padding: 15px;
}

.announcement__link {
  color: #fff;
  opacity: 0.8;
  display: block;
  transition: opacity 0.2s ease-in-out;
}

.announcement__link:hover {
  color: #fff;
  opacity: 1;
  text-decoration: none;
}

.announcement__image {
  min-width: 100px;
  width: 100px;
  display: block;
  position: relative;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  margin: 10px 0;
}

.announcement__image:before {
  content: '';
  display: block;
  padding-top: 100%;
}

.announcementBlock {
  background-color: #F2ECDE;
  border: 3px solid #D0BA88;
  width: 100%;
  height: 100%;
  box-shadow: 0 0 15px -5px #000000;
}

.june-update .page-content .imageBlockContainer img {
  border: 1px solid #aaa;
  margin-top: 20px;
}

.june-update .page-content.page_alleviate-poverty {
  border-top: 5px solid #107850;
}

.june-update .page-content.page_alleviate-poverty .headline {
  background-color: #107850;
}

.june-update .page-content.page_alleviate-poverty .timeline h3 {
  margin-top: 20px;
  background-color: #107850;
}

.june-update .page-content.page_economy {
  border-top: 5px solid #F9B22D;
}

.june-update .page-content.page_economy .headline {
  background-color: #F9B22D;
  color: #000;
}

.june-update .page-content.page_economy .timeline h3 {
  margin-top: 20px;
  background-color: #F9B22D;
  color: #000;
}

.june-update .page-content.page_employment {
  border-top: 5px solid #DC3A37;
}

.june-update .page-content.page_employment .headline {
  background-color: #DC3A37;
}

.june-update .page-content.page_employment .timeline h3 {
  margin-top: 20px;
  background-color: #DC3A37;
}

.june-update .page-content.page_education {
  border-top: 5px solid #283888;
}

.june-update .page-content.page_education .headline {
  background-color: #283888;
}

.june-update .page-content.page_education .timeline h3 {
  margin-top: 20px;
  background-color: #283888;
}

.june-update .page-content.page_crime {
  border-top: 5px solid #000;
}

.june-update .page-content.page_crime .headline {
  background-color: #000;
}

.june-update .page-content.page_crime .timeline h3 {
  margin-top: 20px;
  background-color: #000;
}

.feb-2020-update .page-content .imageBlockContainer img {
  border: 1px solid #aaa;
  margin-top: 20px;
}

.feb-2020-update .page-content.investment-and-economy, .feb-2020-update .page-content.entrepreneurship, .feb-2020-update .page-content.energy-security, .feb-2020-update .page-content.state-owned-enterprises, .feb-2020-update .page-content.youth-employment, .feb-2020-update .page-content.fighting-corruption-and-state-capture, .feb-2020-update .page-content.combating-crime, .feb-2020-update .page-content.eradicating-gender-based-violence, .feb-2020-update .page-content.investing-in-infrastructure,
.feb-2020-update .page-content.education .feb-2020-update .page-content.agriculture-and-land-reform, .feb-2020-update .page-content.national-health, .feb-2020-update .page-content.addressing-climate-change, .feb-2020-update .page-content.african-innovation {
  border-top: 5px solid #107850;
}

.feb-2020-update .page-content.investment-and-economy .headline, .feb-2020-update .page-content.entrepreneurship .headline, .feb-2020-update .page-content.energy-security .headline, .feb-2020-update .page-content.state-owned-enterprises .headline, .feb-2020-update .page-content.youth-employment .headline, .feb-2020-update .page-content.fighting-corruption-and-state-capture .headline, .feb-2020-update .page-content.combating-crime .headline, .feb-2020-update .page-content.eradicating-gender-based-violence .headline, .feb-2020-update .page-content.investing-in-infrastructure .headline,
.feb-2020-update .page-content.education .feb-2020-update .page-content.agriculture-and-land-reform .headline, .feb-2020-update .page-content.national-health .headline, .feb-2020-update .page-content.addressing-climate-change .headline, .feb-2020-update .page-content.african-innovation .headline {
  background-color: #107850;
}

.feb-2020-update .page-content.investment-and-economy .timeline h3, .feb-2020-update .page-content.entrepreneurship .timeline h3, .feb-2020-update .page-content.energy-security .timeline h3, .feb-2020-update .page-content.state-owned-enterprises .timeline h3, .feb-2020-update .page-content.youth-employment .timeline h3, .feb-2020-update .page-content.fighting-corruption-and-state-capture .timeline h3, .feb-2020-update .page-content.combating-crime .timeline h3, .feb-2020-update .page-content.eradicating-gender-based-violence .timeline h3, .feb-2020-update .page-content.investing-in-infrastructure .timeline h3,
.feb-2020-update .page-content.education .feb-2020-update .page-content.agriculture-and-land-reform .timeline h3, .feb-2020-update .page-content.national-health .timeline h3, .feb-2020-update .page-content.addressing-climate-change .timeline h3, .feb-2020-update .page-content.african-innovation .timeline h3 {
  margin-top: 20px;
  background-color: #107850;
}

.stats-block {
  background-color: #eee5d0;
}

.stats-block__item {
  background-color: #fff;
  border: 6px solid #D9C9A1;
  width: 100%;
  height: 100%;
  padding: 20px 15px;
  font-size: 18px;
  font-size: 1.125rem;
}

.stats-block__item .small p {
  font-size: 14px;
  font-size: 0.875rem;
  color: #999;
}

.vbox-overlay {
  z-index: 10000;
}

.highlightsblock__heading {
  text-transform: uppercase;
}

.highlightsblock__separator {
  border-left: 5px solid #EBDEBD;
}

.highlightsblock__separator--gold {
  border-color: #A8915A;
}

.highlightsblock__list p {
  font-weight: bold;
  font-size: 16px;
  font-size: 1rem;
}

.submenuButton {
  position: absolute;
  top: 23px;
  right: 10px;
  transform: translateY(-50%);
}

.submenuButton .menubar {
  display: block;
  transition: 0.4s;
  border-radius: 5px;
  width: 20px;
  height: 2px;
  margin: 4px 0;
  background-color: #000;
}

.submenuButton:not(.collapsed) .menubar:nth-of-type(1) {
  transform: rotate(-45deg) translateY(6px) translateX(-6px);
}

.submenuButton:not(.collapsed) .menubar:nth-of-type(3) {
  transform: rotate(45deg) translateY(-6px) translateX(-6px);
}

.submenuButton:not(.collapsed) .menubar:nth-of-type(2) {
  opacity: 0;
}

@media screen and (min-width: 576px) {
  .submenuButton {
    right: 20px;
  }
  .submenuButton .menubar {
    width: 30px;
    height: 3px;
    margin: 6px 0;
  }
}

.dropdown-item:active {
  background-color: #d0d0d0;
}

.swish {
  background-image: url(/assets/images/swish.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: left;
  position: relative;
}

.swish--smaller {
  background-size: auto 70%;
}

@media screen and (max-width: 769px) {
  .swish:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.8);
  }
}

.swish h1 {
  text-shadow: 0px 0px 15px #FFF;
}

.swoosh {
  background-image: url(/assets/images/swoosh.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: left;
  position: relative;
}

@media screen and (max-width: 769px) {
  .swoosh:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.8);
  }
}

.swoosh h1, .swoosh h2, .swoosh h3, .swoosh h4, .swoosh h5, .swoosh h6 {
  text-shadow: 0px 0px 15px #FFF;
}

@media (min-width: 768px) {
  .swoosh--padding {
    padding-left: 200px;
  }
}

.documentRow .imagePreview {
  width: 160px;
  height: 230px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  margin: 0 auto;
  margin-bottom: -65px;
  position: relative;
  z-index: 1;
}

.documentRow__wrapper {
  width: 100%;
  flex-wrap: wrap;
  flex-direction: row;
}

.documentRow__link {
  display: block;
  margin: 15px 5px;
  color: #000;
  max-width: 500px;
  text-decoration: none;
  font-size: 20px;
  flex: 1;
  flex-basis: 30%;
}

.documentRow__link:hover {
  color: #000;
  text-decoration: none;
}

.documentRow__link--noImage {
  padding-top: 30px;
}

.documentRow .documentRow__heading {
  font-weight: 500;
}

.documentRow .documentRow__clickText {
  font-weight: 400;
  font-size: 18px;
}

.documentRow__detailsWrapper {
  padding: 80px 10px 15px;
  background: #ece0c6;
  background: linear-gradient(0deg, #ece0c6 0%, rgba(255, 255, 255, 0) 100%);
}

.documentRow__detailsWrapper--grey {
  background: none;
  background: #E8E8E8;
}

.documentRow__detailsWrapper p {
  max-width: 350px;
  margin: 0 auto;
}

.documentRow__link--noImage .documentRow__detailsWrapper {
  padding: 10px 10px 15px;
}

.documentRow--wide .documentRow__link {
  max-width: 800px;
}

.documentRow--wide .documentRow__detailsWrapper p {
  max-width: 600px;
}

.cornerShadow {
  padding-right: 21px;
  padding-bottom: 21px;
  position: relative;
  z-index: 1;
}

.cornerShadow:before {
  content: '';
  background-image: url("../assets/shadow-corner.png");
  background-repeat: no-repeat;
  background-position: bottom right;
  position: absolute;
  bottom: 0;
  right: 0;
  height: 100%;
  width: 100%;
  max-height: 203px;
  z-index: -1;
}

.smallCommitment {
  border: 3px solid #fff;
  display: inline-block;
}

.smallCommitment.selected {
  border: 3px solid red;
}

.com__filter {
  position: relative;
  margin-right: 20px;
  border-radius: 6px;
  opacity: 0.7;
  transition: opacity 0.25s;
}

.isActive .com__filter {
  opacity: 0.2;
}

.com__filter:hover, .com__filter.selected {
  opacity: 1;
}

.com__filter.selected a {
  font-weight: bold;
}

.com__filter a {
  display: block;
  padding: 5px 12px;
  padding-right: 35px;
  color: #000;
  font-size: 16px;
  font-weight: normal;
  margin-bottom: 4px;
  text-decoration: none;
}

.com__filter.text-light a {
  color: #fff;
}

.com__filter-arrow {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 35px;
  text-align: center;
  opacity: 0.8;
}

.com__filter-arrow:hover {
  background-color: rgba(255, 255, 255, 0.1);
  opacity: 1;
}

.com__toggle a {
  display: block;
  border: 2px solid #000;
  width: 50px;
  border-radius: 15px;
  opacity: 0.5;
  box-shadow: 0 0 0 rgba(0, 0, 0, 0.2);
  text-decoration: none;
  transition: opacity 0.2s;
}

.com__toggle a:hover {
  opacity: 1;
}

.com__toggle a span {
  display: block;
  width: 25px;
  height: 25px;
  border-radius: 13px;
  background-color: #000;
  transform: translateX(0);
  transition: transform 0.2s;
}

.com__toggle.enabled a {
  opacity: 1;
}

.com__toggle.enabled span {
  transform: translateX(21px);
}

.com__search {
  border-radius: 13px;
  border: 2px solid #000;
  background-color: rgba(255, 255, 255, 0.4);
  padding: 5px 15px;
  width: 80%;
}

.com__search:-ms-input-placeholder {
  font-style: italic;
  font-size: 14px;
}

.com__search::placeholder {
  font-style: italic;
  font-size: 14px;
}

.com__search:focus {
  background-color: rgba(255, 255, 255, 0.8);
}

.com__count {
  display: inline-block;
  margin-left: 3px;
  font-size: 18px !important;
  font-style: italic;
  opacity: 0.4;
}

.com__commitment {
  width: 100%;
  position: relative;
  display: block;
  cursor: unset;
  background-color: rgba(255, 255, 255, 0.4);
  border: 1px solid #fff;
  pointer-events: none;
  padding: 15px 15px 15px 55px;
  margin-bottom: 10px;
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

.com__commitment h2, .com__commitment div, .com__commitment:hover {
  text-decoration: none;
}

.com__commitment p {
  color: #777;
}

.completed .com__commitment {
  background-color: rgba(255, 255, 255, 0.9);
  cursor: pointer;
}

.completed .com__commitment.hasImage {
  pointer-events: auto;
}

.completed .com__commitment:hover {
  background-color: white;
  border-color: #ddd;
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.2);
}

.com__commitment h2 {
  font-size: 18px;
  color: #111;
  font-weight: 500;
  margin-bottom: 0;
}

.com__commitment-indicator {
  display: block;
  position: absolute;
  top: 15px;
  left: 15px;
  background-color: #999;
  width: 23px;
  height: 23px;
  border-radius: 6px;
}

.com__wrapper {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  padding-top: 15px;
  margin-top: 8px;
  padding-right: 25px;
  padding-bottom: 25px;
  max-height: 75vh;
  overflow: auto;
}

.com__wrapper::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 7px;
  background-color: #ddd;
}

.com__wrapper::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
}

.com__check {
  width: 60px;
  height: 25px;
  margin-left: 40px;
}

.com__check--mark {
  display: block;
  position: absolute;
  bottom: 80%;
  transform: translateY(50%);
  right: -10px;
  margin: 0 auto;
  width: 60px;
  height: 70px;
  background-image: url("/assets/green-check.png");
  background-size: contain;
  background-repeat: no-repeat;
  border-radius: 4px;
}

.com__check--mark-progress {
  background-image: url("/assets/progress-check.png");
}

.clickableItem {
  cursor: pointer;
}

.commitmentModal {
  position: fixed;
  z-index: 9999;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.7);
  display: flex;
  justify-content: center;
  align-items: center;
}

.commitmentModal__inner {
  width: 95%;
  max-width: 600px;
}

.commitmentModal__inner--large {
  max-width: 1060px;
}

.commitmentModal__inner img {
  max-width: 100%;
}

.commitmentModal__link {
  display: inline-block;
  background-color: #ddd;
  padding: 10px 20px;
  color: #000;
  margin-bottom: 30px;
  border-radius: 5px;
  transition: background-color 0.3s ease-in-out;
}

.commitmentModal__link:hover {
  background-color: #ddd;
  color: #000;
  text-decoration: none;
}

.commitmentModal__content {
  background-color: #fff;
  box-shadow: 10px 10px 30px rgba(0, 0, 0, 0.7);
  max-height: 80vh;
  overflow: auto;
}

.commitmentModal .modalCloser {
  position: absolute;
  right: 20px;
  top: 20px;
  width: 32px;
  height: 32px;
  opacity: 0.6;
  z-index: 10;
}

.commitmentModal .modalCloser:hover {
  opacity: 1;
}

.commitmentModal .modalCloser:before, .commitmentModal .modalCloser:after {
  position: absolute;
  left: 15px;
  content: ' ';
  height: 33px;
  width: 2px;
  background-color: #fff;
}

.commitmentModal .modalCloser:before {
  transform: rotate(45deg);
}

.commitmentModal .modalCloser:after {
  transform: rotate(-45deg);
}

@media screen and (min-width: 992px) {
  .navbar-nav--dividers li.nav-item:not(:last-child) {
    position: relative;
    display: flex;
    align-items: center;
  }
  .navbar-nav--dividers li.nav-item:not(:last-child):after {
    content: '';
    display: inline;
    background-color: #000;
    opacity: 0.5;
    height: 85%;
    width: 2px;
    margin: 0 30px;
    border-right: 0 solid #555;
  }
}

a.click-to-save-nav {
  animation-name: click-back;
  border-radius: 10px;
  animation-iteration-count: infinite;
  animation-duration: 2.5s;
}

@keyframes click-back {
  0% {
    background-color: #f9e50e;
    color: #000;
  }
  50% {
    background-color: #f9e50e;
    color: #000;
  }
  51% {
    background-color: #000;
    color: #f9e50e;
  }
  100% {
    background-color: #000;
    color: #f9e50e;
  }
}

@media screen and (min-width: 800px) {
  .fixed-links .fixed-sub-links {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    padding: 10px;
    z-index: 1000;
    background-color: rgba(255, 255, 255, 0.9);
  }
}

.loginFormContainer {
  height: 100vh;
}

.login-form {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.flagRightBorder {
  padding-right: 10px;
  display: block;
}

.flagRightBorder:before {
  content: '';
  background-color: hotpink;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 10px;
  background-image: url("/assets/flag.png");
  background-position: center;
  background-size: cover;
}

.homeblock2020:hover {
  text-decoration: none;
}

.homeblock2020__panel {
  position: absolute;
  left: 0;
  bottom: 0;
  padding: 45px;
  background-color: rgba(10, 10, 10, 0.6);
}

.homeblock2020__feature .homeblock2020__panel {
  top: 0;
  display: flex;
  padding: 45px;
  padding-bottom: 60px;
  flex-direction: column;
  justify-content: flex-end;
}

@media screen and (min-width: 769px) {
  .homeblock2020__feature .homeblock2020__panel {
    width: 380px;
  }
}

@media screen and (max-width: 769px) {
  .homeblock2020__feature .homeblock2020__panel {
    position: relative;
    padding: 25px;
  }
}

@media screen and (max-width: 769px) {
  .homeblock2020__feature .homeblock__img {
    min-height: 250px;
  }
}

.homeblock2020__basic .homeblock2020__panel {
  right: 0;
  display: flex;
  padding: 25px 45px;
  justify-content: flex-end;
  justify-content: start;
  align-items: center;
}

@media screen and (max-width: 769px) {
  .homeblock2020__basic .homeblock2020__panel {
    padding: 25px;
  }
}

.homeblock2020__basicSlim .homeblock__img {
  transition-duration: 0.5s;
  transform-origin: bottom right;
}

.homeblock2020__basicSlim .homeblock__img:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: black;
  opacity: 0.4;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, black 100%);
  transition: opacity 0.5s ease-in-out;
}

.homeblock2020__basicSlim .homeblock__title:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: -500px;
  background: black;
  opacity: 0.5;
  background: linear-gradient(90deg, black 0%, transparent 100%);
  z-index: 1;
  transition: opacity 0.5s ease-in-out;
}

.homeblock2020__basicSlim .homeblock2020__panel {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  left: initial;
  padding: 0;
  right: 0;
  background-color: transparent;
  color: #fff;
  transform: rotate(180deg) translate(-10px);
  opacity: 0.85;
  padding: 10px 0;
  transition: transform 0.1s;
}

.homeblock2020__basicSlim .homeblock2020__panel .homeblock__title {
  color: #fff;
  font-size: 50px;
  font-size: 3.125rem;
  line-height: 44px;
}

.homeblock2020__basicSlim .homeblock2020__panel .homeblock__title span {
  text-transform: lowercase;
}

.homeblock2020__basicSlim:hover .homeblock__title:before {
  opacity: 0.1;
}

.homeblock2020__basicSlim:hover .homeblock2020__panel {
  transform: rotate(180deg) translate(0);
  opacity: 1;
  transition: opacity 0.2s, transform 0.5s ease-out;
}

.homeblock2020__basicSlim:hover .homeblock__img {
  transition-duration: 1.5s;
}

.homeblock2020__basicSlim:hover .homeblock__img:before {
  opacity: 0.7;
}

.homeblock2020 h1 {
  color: #fff;
  font-weight: 900;
  font-size: 50px;
  font-size: 3.125rem;
  line-height: 50px;
}

.homeblock2020 h2 {
  color: #fff;
  font-weight: 900;
  font-size: 32px;
  font-size: 2rem;
  line-height: 32px;
}

.homeblock2020 .homeblock__blurb {
  color: #fff;
  font-weight: 400;
  font-size: 16px;
  font-size: 1rem;
  line-height: 16px;
  letter-spacing: 1.5px;
  opacity: 0.8;
}

.homeblock2020 .linkButton {
  position: relative;
  display: inline-block;
  width: 100%;
  padding: 10px;
  margin: 0;
  text-align: center;
  text-transform: uppercase;
  font-weight: 600;
  border-radius: 3px;
  letter-spacing: 1px;
  color: #fff;
  background-color: #027249;
}

.homeblock2020 .linkButton__icon {
  width: 50px;
  height: 50px;
  flex-shrink: 0;
}

.homeblock2020 .linkButton__icon:before {
  content: '';
  width: 0;
  height: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-style: solid;
  border-width: 8px 0 8px 10px;
  border-color: transparent transparent transparent #ffffff;
}

.June2019__opener {
  cursor: pointer;
  position: relative;
}

.June2019__opener:before {
  content: '';
  position: absolute;
  top: 50%;
  right: 0;
  transform: translate(0, -50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 18px 18px 0 18px;
  border-color: #000000 transparent transparent transparent;
  transition: transform 0.2s ease-in-out;
}

.June2019__container {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease-in-out;
}

.June2019__wrapper.open .June2019__opener:before {
  transform: rotate(180deg) translate(0, 50%);
}

.June2019__wrapper.open .June2019__container {
  max-height: 3600px;
}

@media screen and (min-width: 769px) {
  .June2019__wrapper.open .June2019__container {
    max-height: 2500px;
  }
}

.sidebar-wrapper {
  padding-bottom: 30px;
}

.sidebar-wrapper .flex-grow-0 {
  flex-grow: 0 !important;
}

.sidebar-wrapper .flex-shrink-0 {
  flex-shrink: 0 !important;
}

.sidebar-twitter-wrapper {
  flex-grow: 1;
  padding-bottom: 88px;
}

.sidebar-twitter-wrapper .twitter-timeline {
  height: 100% !important;
}

.sidebar-block {
  display: block;
  position: relative;
  padding-top: 61.2%;
  background-size: cover;
  background-position: center;
  overflow: hidden;
  cursor: pointer;
  text-decoration: none;
}

.sidebar-block:hover {
  text-decoration: none;
}

.sidebar-block--constitution {
  text-align: right;
}

.sidebar-block--constitution .sidebar-block-inner {
  width: 65%;
  position: absolute;
  bottom: 0;
  right: 0;
  color: #fff;
  margin-bottom: 10px;
  padding-right: 10px;
}

.sidebar-block--constitution .heading {
  font-size: 22px;
  line-height: 22px;
  font-weight: 600;
  letter-spacing: 0.5px;
  margin-bottom: 5px;
}

.sidebar-block--constitution .cta {
  display: block;
  font-size: 18px;
}

@media screen and (min-width: 992px) {
  .sidebar-block--constitution .heading {
    font-size: 20px;
  }
}

.sidebar-block--vulindlela {
  text-align: right;
}

.sidebar-block--vulindlela .sidebar-block-inner {
  background-color: black;
  width: 100%;
  position: absolute;
  top: 0;
  right: 0;
  color: #fff;
  padding: 5px 15px;
}

.sidebar-block--vulindlela .heading {
  font-size: 22px;
  line-height: 22px;
  font-weight: 600;
  letter-spacing: 0.5px;
  margin-bottom: 5px;
}

.quote-tweet {
  background-color: #efefef;
  border-radius: 16px;
}

.quote-tweet__text {
  display: block;
  font-style: italic;
  font-size: calc(24px + 0.15vw);
  line-height: calc(30px + 0.15vw);
  opacity: 0.7;
}

.newsFlashBanner {
  background: #c5a052;
  background: linear-gradient(90deg, #c5a052 0%, #faf4bc 25%, #c5a052 50%, #faf4bc 75%, #c5a052 100%);
}

.landing_2022 h1, .landing_2022 .h1 {
  font-size: 2.2em;
}

.landing_2022 h2, .landing_2022 .h2 {
  font-size: 2em;
}

.landing_2022 h3, .landing_2022 .h3 {
  font-size: 1.8em;
}

.landing_2022 h4, .landing_2022 .h4 {
  font-size: 1.6em;
}

.landing_2022 h5, .landing_2022 .h5 {
  font-size: 1.4em;
}

.landing_2022 h6, .landing_2022 .h6 {
  font-size: 1.2em;
}

.landing_2022 p, .landing_2022 span {
  font-size: 1em;
}

.landing_2022 p.lead, .landing_2022 span.lead {
  font-size: 1.4em;
  font-weight: normal;
}

.landing_2022 p.lead strong, .landing_2022 span.lead strong {
  font-weight: bold;
}

.focusTheme__icon {
  width: 74px;
  height: 74px;
  flex-grow: 0;
  flex-shrink: 0;
  background-color: #927b48;
}

.focusTheme__heading {
  height: 74px;
  background-color: #e2cc9a;
}

.focusTheme__details {
  background-color: #e2cc9a;
  min-height: 150px;
}

.dashboardLink {
  display: inline-block;
  position: relative;
  width: 100%;
  color: #000;
}

.dashboardLink:hover {
  color: #000;
  text-decoration: none;
}

.dashboardLink p {
  font-size: 20px;
  position: absolute;
  bottom: 20px;
  left: 20px;
}

.vulindlelaBanner {
  display: inline-block;
  position: relative;
  width: 100%;
  color: #fff;
}

.vulindlelaBanner:hover {
  color: #fff;
  text-decoration: none;
}

.vulindlelaBanner p {
  font-size: 20px;
  position: absolute;
  top: 26px;
  left: 41.5%;
}

.newsArtical {
  color: #000;
}

.newsArtical__image {
  width: 150px;
  flex-grow: 0;
  flex-shrink: 0;
  background-size: cover;
  background-position: center;
}

.newsArtical__info {
  background-color: #f1f0f0;
  width: 100%;
  min-height: 110px;
}

.newsArtical__detail {
  color: #706f6f;
}

.newsArtical__heading {
  font-weight: bold;
}

.newsArtical:hover {
  text-decoration: none;
  color: #000;
  opacity: 0.8;
}

.newsArtical__link {
  color: #333;
}

.newsArtical__link:hover {
  color: #000;
}

.newsArtical__date {
  font-size: 11px;
  line-height: 15px;
}

.carouselIcon {
  height: 25px;
  width: 25px;
  border-top: 5px solid #000;
  border-left: 5px solid #000;
  transform: rotate(-45deg);
}

.carouselIcon-next {
  transform: rotate(135deg);
}

.carousel-control-next,
.carousel-control-prev {
  width: 9%;
}

.carousel-indicators {
  position: absolute;
  bottom: 10px;
  right: calc(20px + 10%);
  left: unset;
  width: auto;
  margin: 0;
}

@media screen and (min-width: 769px) {
  .carousel-indicators {
    bottom: 20px;
  }
}

.carousel-indicators li {
  height: 16px;
  width: 16px;
  border-radius: 50%;
  background-color: #817373;
  opacity: 0.5;
}

@media screen and (min-width: 769px) {
  .carousel-indicators li {
    height: 22px;
    width: 22px;
  }
}

.carousel-indicators li.active {
  background-color: #817373;
  opacity: 0.8;
}

.siteFooter {
  background-color: black;
  color: #fff;
}

.siteFooter a {
  color: #fff;
  text-decoration: none;
  display: block;
}

.siteFooter .priorityLinks {
  column-count: 1;
}

@media screen and (min-width: 769px) {
  .siteFooter .priorityLinks {
    column-count: 2;
  }
  .siteFooter .priorityLinks > *, .siteFooter .priorityLinks > * > * {
    break-inside: avoid;
  }
}

.siteFooter--white {
  background-color: #fff;
  color: #000;
}

.siteFooter--white a {
  color: #000;
}

.siteFooter--white .border-t {
  border-top: 1px solid #000;
}

.venoiframe--trigger {
  position: fixed;
  top: 0;
  left: 0;
  width: 0px;
  height: 0px;
}

.full-frame-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media screen and (min-width: 769px) {
  .full-frame-layer.title-holder {
    transform: translateY(-5%);
  }
}

@media screen and (min-width: 769px) {
  .full-frame-layer.title-holder--3 {
    transform: translateY(-6%);
  }
}

.h-card {
  border-radius: 10px;
  border: none;
  overflow: hidden;
  text-align: center;
  transform: scale(1);
  transition: transform 0.1s ease;
}

.h-card--grad {
  background: linear-gradient(180deg, #000 0%, #FFF 50%) !important;
}

.h-card img {
  transform: scale(1.02);
}

.h-card__wrapper {
  margin-top: 20px;
}

@media screen and (min-width: 769px) {
  .h-card__wrapper {
    margin-top: -110px;
  }
}

.h-card .greyover {
  filter: grayscale(100%);
  transition: filter 0.5s ease;
}

.h-card:hover {
  transform: scale(1.05);
}

.h-card:hover .greyover {
  filter: grayscale(0%);
}

.h-card a {
  color: #000;
}

.h-card a h2 {
  font-size: 15px;
  line-height: calc(15px + 1.5px);
}

@media screen and (min-width: 376px) {
  .h-card a h2 {
    font-size: calc(15px + 3 * ((100vw - 376px) / 794));
    line-height: calc(15px + 3 * ((100vw - 376px) / 794) + 1.5px);
  }
}

@media screen and (min-width: 1170px) {
  .h-card a h2 {
    font-size: 18px;
    line-height: calc(18px + 1.8px);
  }
}

.h-card a:hover {
  text-decoration: none;
}

.h-card__rmore {
  margin-top: 15px;
  opacity: 0.7;
}

.h-card__rmore::after {
  content: "";
  background-image: url(/assets/home-2023/v-play.svg);
  background-repeat: no-repeat;
  background-size: contain;
  width: 20px;
  height: 20px;
  display: inline-block;
  margin-left: 6px;
  vertical-align: middle;
}

.banner-buttons {
  margin-top: 10px;
}

@media screen and (min-width: 769px) {
  .banner-buttons {
    position: absolute;
    top: 48.5%;
    left: 41.5%;
  }
}

.btn--watch {
  align-items: center;
  justify-content: center;
  padding: 15px 20px;
  margin-bottom: 10px;
  background-color: #D30000;
  border-radius: 20px;
  border: 1px solid #D30000;
  font-size: 16px;
  line-height: calc(16px + 1.6px);
  line-height: 24px !important;
  cursor: pointer;
}

@media screen and (min-width: 376px) {
  .btn--watch {
    font-size: calc(16px + -2 * ((100vw - 376px) / 794));
    line-height: calc(16px + -2 * ((100vw - 376px) / 794) + 1.6px);
  }
}

@media screen and (min-width: 1170px) {
  .btn--watch {
    font-size: 14px;
    line-height: calc(14px + 1.4px);
  }
}

.btn--watch:hover {
  background-color: #a90606;
}

@media screen and (max-width: 769px) {
  .btn--watch {
    width: 100%;
  }
}

.btn--black {
  align-items: center;
  justify-content: center;
  padding: 15px 20px;
  margin-bottom: 10px;
  background-color: #000;
  border: 1px solid #fff;
  border-radius: 20px;
  font-size: 16px;
  line-height: calc(16px + 1.6px);
  line-height: 24px !important;
  cursor: pointer;
}

@media screen and (min-width: 376px) {
  .btn--black {
    font-size: calc(16px + -2 * ((100vw - 376px) / 794));
    line-height: calc(16px + -2 * ((100vw - 376px) / 794) + 1.6px);
  }
}

@media screen and (min-width: 1170px) {
  .btn--black {
    font-size: 14px;
    line-height: calc(14px + 1.4px);
  }
}

.btn--black:hover {
  border: 1px solid #929292;
}

@media screen and (max-width: 769px) {
  .btn--black {
    width: 100%;
  }
}

.header-block {
  column-gap: 40px;
}

.header-block h2 {
  font-size: 18px;
  line-height: calc(18px + 1.8px);
  text-transform: uppercase;
  margin-bottom: 0;
}

@media screen and (min-width: 376px) {
  .header-block h2 {
    font-size: calc(18px + 2 * ((100vw - 376px) / 794));
    line-height: calc(18px + 2 * ((100vw - 376px) / 794) + 1.8px);
  }
}

@media screen and (min-width: 1170px) {
  .header-block h2 {
    font-size: 20px;
    line-height: calc(20px + 2px);
  }
}

.header-block:after {
  content: "";
  width: 100%;
  height: 1px;
  border-top: 1px solid #000;
}

.commitmentCardSlider ul {
  font-size: 1em;
  padding-left: 20px;
}

.commitmentCardSlider ul li {
  font-size: 1em;
}

.commitmentCardSlider .flex-grow-1 {
  flex-grow: 1;
}

.commitmentCardSlider__cardWrapper {
  padding: 20px 10px;
  width: calc(100vw - 35px);
}

@media screen and (min-width: 576px) {
  .commitmentCardSlider__cardWrapper {
    width: calc(50vw - 20px);
    padding: 30px 20px;
  }
}

@media screen and (min-width: 976px) {
  .commitmentCardSlider__cardWrapper {
    width: 400px;
    padding: 30px 20px;
  }
}

.commitmentCardSlider__cardInner {
  position: relative;
  transform-style: preserve-3d;
  perspective: 1000px;
  transition: all 0.6s ease;
  height: auto;
}

.commitmentCardSlider__cardFront, .commitmentCardSlider__cardBack {
  overflow: hidden;
  background: #FFFFFF;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.25);
  border-radius: 8px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transition: position 0.1s ease 3s, transform 0.4s ease;
}

@media screen and (min-width: 576px) {
  .commitmentCardSlider__cardFront, .commitmentCardSlider__cardBack {
    box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.25);
  }
}

.commitmentCardSlider__cardFront {
  min-height: 450px;
  transform: rotateY(0deg);
  position: relative;
}

.commitmentCardSlider .cardFrontContent {
  width: 100%;
  padding: 30px;
  text-align: center;
}

.commitmentCardSlider__cardBack {
  min-height: 500px;
  padding: 20px 40px;
  display: flex;
  transform: rotateY(-180deg);
  position: absolute;
}

.commitmentCardSlider .cardBackContent {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.commitmentCardSlider .cardBackContent__top {
  flex-grow: 1;
}

.flipped .commitmentCardSlider__cardFront {
  transform: rotateY(180deg);
  position: absolute;
}

.flipped .commitmentCardSlider__cardBack {
  transform: rotateY(0deg);
  position: relative;
}

.commitmentCardSlider .btn {
  align-items: center;
  padding: 15px 20px;
  width: 100%;
  max-width: 250px;
  border-radius: 10px;
  background-color: #000;
  color: #FFFFFF;
  line-break: normal;
  white-space: normal;
  font-size: 16px;
}

.commitmentCardSlider .cardImage {
  width: 100%;
  padding-top: 60%;
  background-color: #000;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.commitmentCardSlider .theme-red .btn {
  background-color: #DC3A37;
}

.commitmentCardSlider .theme-green .btn {
  background-color: #007748;
}

.commitmentCardSlider .theme-yellow .btn {
  background-color: #FEB81C;
}

.commitmentCardSlider .theme-blue .btn {
  background-color: #001389;
}

.commitmentCardSlider .latestAction {
  background: #FFFFFF;
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.25);
  border-radius: 6px;
  padding: 15px;
  position: relative;
}

.commitmentCardSlider .latestAction span.checkmark {
  display: block;
  position: absolute;
  top: -5px;
  right: 0;
  width: 35px;
  height: 50px;
  background-image: url("/assets/green-check.png");
  background-size: contain;
  background-repeat: no-repeat;
}

.scrollTrigger:hover {
  cursor: pointer;
  text-decoration: none;
  opacity: 0.6;
}

.swiperFilterBtn {
  position: relative;
  align-items: center;
  padding: 14px 48px 14px 15px;
  width: 100%;
  max-width: 100%;
  border-radius: 10px;
  line-break: normal;
  white-space: normal;
  margin-bottom: 20px;
  background: #FFFFFF;
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.25);
  border-radius: 8px;
  border: 0;
}

@media screen and (min-width: 769px) {
  .swiperFilterBtn {
    max-width: 300px;
  }
}

.swiperFilterBtn:focus {
  outline: none;
  border: none;
}

.swiperFilterBtn svg {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  transition: transform .2s ease;
}

.swiperFilterBtn svg path {
  fill: #000;
}

.swiperFilterBtn.theme-red svg path {
  fill: #DC3A37;
}

.swiperFilterBtn.theme-green svg path {
  fill: #007748;
}

.swiperFilterBtn.theme-yellow svg path {
  fill: #FEB81C;
}

.swiperFilterBtn.theme-blue svg path {
  fill: #001389;
}

.swiperFilterBtn.active {
  background-color: #000000;
  color: #FFFFFF;
}

.swiperFilterBtn.active svg {
  transform: translateY(-50%) rotateZ(180deg);
}

.swiperFilterBtn.active svg path {
  fill: #fff;
}

.swiperFilterBtn.active.theme-red {
  background-color: #DC3A37;
}

.swiperFilterBtn.active.theme-red svg path {
  fill: #fff;
}

.swiperFilterBtn.active.theme-green {
  background-color: #007748;
}

.swiperFilterBtn.active.theme-green svg path {
  fill: #fff;
}

.swiperFilterBtn.active.theme-yellow {
  background-color: #FEB81C;
}

.swiperFilterBtn.active.theme-yellow svg path {
  fill: #fff;
}

.swiperFilterBtn.active.theme-blue {
  background-color: #001389;
}

.swiperFilterBtn.active.theme-blue svg path {
  fill: #fff;
}

.icon-block {
  font-size: 1.3em;
  padding: 20px 5px;
}

.icon-block img {
  max-width: 100px;
  font-size: 1.3em;
}

.stateCaptureLinks {
  border-radius: 5px;
  margin-bottom: 1em;
  color: #fff;
  text-align: center;
  font-size: 18px;
  background-color: #22428D;
  width: 100%;
}

.stateCaptureLinks:hover {
  background-color: #09235E;
  color: #fff;
  text-decoration: none;
}

.stateCaptureLinks--dark {
  background-color: #09235E;
}

.stateCaptureLinks--dark:hover {
  background-color: #22428D;
}

.operation-vulindlela {
  color: #22252A;
}

.operation-vulindlela h1 {
  font-weight: bold;
  font-size: 28px;
  text-transform: uppercase;
}

@media (min-width: 768px) {
  .operation-vulindlela h1 {
    font-size: 34px;
  }
}

@media (min-width: 1200px) {
  .operation-vulindlela h1 {
    font-size: 40px;
  }
}

.operation-vulindlela h2 {
  font-weight: bold;
  font-size: 20px;
  text-transform: uppercase;
}

@media (min-width: 768px) {
  .operation-vulindlela h2 {
    font-size: 28px;
  }
}

@media (min-width: 992px) {
  .operation-vulindlela h2 {
    font-size: 35px;
  }
}

.operation-vulindlela p {
  font-size: 1rem;
}

@media (min-width: 768px) {
  .operation-vulindlela p {
    font-size: 18px;
  }
}

@media (min-width: 1200px) {
  .operation-vulindlela p {
    font-size: 20px;
  }
}

.operation-vulindlela .flex-columns {
  display: flex;
  flex-wrap: wrap;
}

.operation-vulindlela--summary {
  margin-top: 3rem;
  margin-bottom: 3rem;
}

.operation-vulindlela--summary .content h2 {
  font-size: 20px;
}

.operation-vulindlela--summary .content ol li {
  font-size: 20px;
}

@media (min-width: 768px) {
  .operation-vulindlela--summary .content {
    padding: 0 2rem;
  }
}

@media (min-width: 992px) {
  .operation-vulindlela--summary .content {
    padding: 0 6rem;
  }
}

@media (min-width: 1200px) {
  .operation-vulindlela--summary .content {
    padding: 0 12rem;
  }
}

.sector--teaser {
  position: relative;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(100% / 3);
  overflow: hidden;
}

.sector--teaser:after {
  content: '';
  position: absolute;
  z-index: 2;
  display: block;
  width: 40px;
  height: 100%;
  right: 0;
  top: 0;
  background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5));
}

.sector--teaser__title {
  position: absolute;
  z-index: 3;
  display: block;
  width: 18px;
  height: 100%;
  right: 0;
  top: 0;
}

.sector--teaser__title h3 {
  position: absolute;
  transform: rotate(-90deg);
  width: 100%;
  display: block;
  bottom: 0;
  white-space: nowrap;
  color: white;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 22px;
}

.sector--teaser__image {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 50%;
  transform: translateX(-50%) scale(1.1);
}

@media (min-width: 576px) {
  .sector--teaser {
    flex-basis: calc(100% / 5);
  }
  .sector--teaser .teaser--sector__image {
    transform: translateX(-50%) scale(1);
  }
}

@media (min-width: 768px) {
  .sector--teaser .teaser--sector__image {
    transform: translateX(-50%) scale(1.15);
  }
}

@media (min-width: 992px) {
  .sector--teaser:after {
    right: -20px;
    transition: right 0.4s ease-in-out;
  }
  .sector--teaser .teaser--sector__title {
    right: -2px;
    transition: right 0.4s ease-in-out;
  }
  .sector--teaser .teaser--sector__image {
    transform: translateX(-50%) scale(1);
    transition: transform 0.4s ease-in-out;
  }
  .sector--teaser:hover:after {
    right: 0;
  }
  .sector--teaser:hover .teaser--sector__title {
    right: 4px;
  }
  .sector--teaser:hover .teaser--sector__image {
    transform: translateX(-50%) scale(1.1);
  }
}

.sector--card {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 100%;
  background: white;
  border-radius: 12px;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.25);
  margin-top: 2rem;
  border: 2px solid white;
}

.sector--card:first-child {
  margin-top: 0;
}

.sector--card a {
  padding: 1rem 2rem;
  display: block;
  text-decoration: none;
  color: #22252A;
  display: flex;
  flex-wrap: wrap;
}

@media (min-width: 576px) {
  .sector--card a {
    flex-wrap: nowrap;
  }
}

@media (min-width: 768px) {
  .sector--card a {
    flex-wrap: wrap;
  }
}

@media (min-width: 992px) {
  .sector--card a {
    flex-wrap: nowrap;
  }
}

.sector--card__icon {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 100%;
  margin-bottom: 1rem;
  text-align: center;
}

@media (min-width: 576px) {
  .sector--card__icon {
    flex-basis: 90px;
    margin-right: 1rem;
  }
}

@media (min-width: 768px) {
  .sector--card__icon {
    flex-basis: 100%;
    margin-right: 0;
  }
}

@media (min-width: 992px) {
  .sector--card__icon {
    flex-basis: 90px;
    margin-right: 1rem;
  }
}

.sector--card h3 {
  color: #22252A;
  font-size: 18px;
  font-weight: bold;
  transition: color 0.2s ease-in-out;
}

.sector--card p {
  font-size: 1rem;
}

.sector--card span.link {
  text-transform: uppercase;
  text-decoration: underline;
}

@media (min-width: 768px) {
  .sector--card {
    flex-basis: calc(50% - 1rem);
  }
  .sector--card:nth-child(2) {
    margin-top: 0;
  }
  .sector--card:nth-child(2n+1) {
    margin-right: 1rem;
  }
  .sector--card:nth-child(2n+2) {
    margin-left: 1rem;
  }
}

@media (min-width: 992px) {
  .sector--card {
    transition: border 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
  }
  .sector--card:hover {
    box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.4);
  }
  .sector--card--electricity-sector:hover {
    border-color: #009D4E;
  }
  .sector--card--electricity-sector:hover h3 {
    color: #009D4E;
  }
  .sector--card--digital-communications-sector:hover {
    border-color: #D32625;
  }
  .sector--card--digital-communications-sector:hover h3 {
    color: #D32625;
  }
  .sector--card--water-sector:hover {
    border-color: #173AB0;
  }
  .sector--card--water-sector:hover h3 {
    color: #173AB0;
  }
  .sector--card--transport-sector:hover {
    border-color: #22252A;
  }
  .sector--card--transport-sector:hover h3 {
    color: #22252A;
  }
  .sector--card--visa-regime:hover {
    border-color: #F3B400;
  }
  .sector--card--visa-regime:hover h3 {
    color: #F3B400;
  }
}

.sector--full .sector--header {
  position: relative;
}

.sector--full .sector--header h1 {
  position: absolute;
  text-align: center;
  color: white;
  left: 50%;
  top: 70%;
  transform: translate(-50%, -50%);
  text-shadow: 2px 2px 10px #22252A;
  white-space: nowrap;
}

.sector--full .sector--header img {
  width: 100%;
  height: auto;
  display: block;
}

.sector--full .sector--introduction {
  padding: 1.5rem;
}

@media (min-width: 768px) {
  .sector--full .sector--introduction {
    padding: 3rem;
  }
}

@media (min-width: 992px) {
  .sector--full .sector--introduction {
    padding: 4rem 12rem;
  }
}

.sector--full .introduction {
  border: 1px solid #22252A;
  border-radius: 12px;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.25);
  display: flex;
  flex-wrap: wrap;
  padding: 2rem;
}

@media (min-width: 768px) {
  .sector--full .introduction {
    flex-wrap: nowrap;
  }
}

.sector--full .introduction__icon {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 100%;
  text-align: center;
  margin-bottom: 1rem;
}

@media (min-width: 768px) {
  .sector--full .introduction__icon {
    flex-basis: 90px;
    margin-right: 1rem;
    margin-bottom: 0;
  }
}

.sector--full .introduction__content {
  display: flex;
  align-items: center;
}

.sector--full .introduction__content h2 {
  font-size: 20px;
  text-transform: none;
  margin-bottom: 0;
}

.sector--full--electricity-sector .introduction {
  border-color: #009D4E;
}

.sector--full--digital-communications-sector .introduction {
  border-color: #D32625;
}

.sector--full--water-sector .introduction {
  border-color: #173AB0;
}

.sector--full--transport-sector .introduction {
  border-color: #22252A;
}

.sector--full--visa-regime .introduction {
  border-color: #F3B400;
}

.sector--full .sector--blurbs .blurb {
  background: #f8f9fa;
  display: flex;
  flex-direction: column;
}

.sector--full .sector--blurbs .blurb__content {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 50%;
  padding: 1.5rem 1.5rem 3rem 1.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  order: 2;
}

.sector--full .sector--blurbs .blurb__content h3 {
  text-transform: uppercase;
  font-weight: bold;
  font-size: 18px;
}

@media (min-width: 1200px) {
  .sector--full .sector--blurbs .blurb__content h3 {
    font-size: 30px;
  }
}

.sector--full .sector--blurbs .blurb__content p:last-child {
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .sector--full .sector--blurbs .blurb__content p {
    font-size: 1rem;
  }
}

@media (min-width: 1200px) {
  .sector--full .sector--blurbs .blurb__content p {
    font-size: 20px;
  }
}

.sector--full .sector--blurbs .blurb__image {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 50%;
  overflow: hidden;
  order: 1;
}

.sector--full .sector--blurbs .blurb__image img {
  width: 100%;
  height: auto;
  display: block;
}

@media (min-width: 768px) {
  .sector--full .sector--blurbs .blurb {
    flex-direction: row;
  }
  .sector--full .sector--blurbs .blurb__content {
    padding: 1.5rem;
  }
  .sector--full .sector--blurbs .blurb__image img {
    transform: scale(2);
  }
  .sector--full .sector--blurbs .blurb:nth-child(even) .blurb__content {
    order: 1;
  }
  .sector--full .sector--blurbs .blurb:nth-child(even) .blurb__image {
    order: 2;
  }
}

@media (min-width: 992px) {
  .sector--full .sector--blurbs .blurb__content {
    padding: 1rem 2rem;
  }
  .sector--full .sector--blurbs .blurb__image img {
    transform: scale(1);
  }
}

@media (min-width: 1200px) {
  .sector--full .sector--blurbs .blurb__content {
    padding: 1rem 3rem;
  }
}

.sector--full .sector--blurbs .blurb--no-image {
  background: #22252A;
  color: white;
}

.sector--full .sector--blurbs .blurb--no-image .blurb__content {
  flex-basis: 100%;
  padding: 1.5rem;
  text-align: center;
  display: block;
}

@media (min-width: 768px) {
  .sector--full .sector--blurbs .blurb--no-image .blurb__content {
    padding: 3rem 6rem;
  }
}

@media (min-width: 992px) {
  .sector--full .sector--blurbs .blurb--no-image .blurb__content {
    padding: 6rem 12rem;
  }
}

ul.collapser {
  list-style: none;
  margin: 0;
  padding: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

ul.collapser li {
  margin-bottom: 4px;
}

ul.collapser li div.bar {
  width: 100%;
  height: auto;
  padding: 0.75rem 1.5rem 0.75rem 3rem;
  margin: 0;
  position: relative;
  cursor: pointer;
  line-height: normal;
  color: white;
  border: 1px solid white;
  font-size: 1rem;
  box-sizing: border-box;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

ul.collapser li div.bar span {
  display: inline;
}

ul.collapser li div.bar:before {
  content: '';
  display: block;
  background-repeat: no-repeat;
  position: absolute;
  left: 0.5rem;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
}

ul.collapser li div.bar:after {
  content: '';
  display: block;
  background-image: url("../assets/arrow_right.svg");
  background-repeat: no-repeat;
  position: absolute;
  right: 0.5rem;
  top: 50%;
  transform: translateY(-50%);
  height: 1rem;
  width: 11px;
}

ul.collapser li div.bar--no-click {
  cursor: default;
}

ul.collapser li div.bar--no-click:after {
  display: none;
}

ul.collapser li div.bar--not-started:before {
  background-image: url("../assets/todo.svg");
}

ul.collapser li div.bar--in-progress:before {
  background-image: url("../assets/inprogress.svg");
}

ul.collapser li div.bar--completed:before {
  background-image: url("../assets/complete.svg");
}

ul.collapser li div.itemContents {
  display: none;
  width: 100%;
  padding: 0.5rem;
  padding: 0.5rem 1.5rem 0.5rem 3rem;
  box-sizing: border-box;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  background: white;
}

ul.collapser li div.itemContents .sub-milestone {
  width: 100%;
  position: relative;
  padding-left: 1.5rem;
  margin-bottom: 0.5rem;
}

ul.collapser li div.itemContents .sub-milestone:before {
  content: '';
  display: block;
  background-repeat: no-repeat;
  background-size: 1rem;
  position: absolute;
  left: 0;
  top: 0.2rem;
  width: 1rem;
  height: 1rem;
}

ul.collapser li div.itemContents .sub-milestone--not-started:before {
  background-image: url("../assets/todo_small.svg");
}

ul.collapser li div.itemContents .sub-milestone--in-progress:before {
  background-image: url("../assets/inprogress.svg");
}

ul.collapser li div.itemContents .sub-milestone--completed:before {
  background-image: url("../assets/complete.svg");
}

ul.collapser li.is-expanded div.bar {
  color: #22252A;
  background: white;
}

ul.collapser li.is-expanded div.bar:after {
  background-image: url("../assets/arrow_down.svg");
  margin-top: 3px;
  width: 1rem;
}

ul.collapser li.is-expanded div.itemContents {
  display: block;
}

.pdf-item {
  display: flex;
  flex-direction: column;
}

@media (min-width: 768px) {
  .pdf-item {
    flex-direction: row;
  }
}

.pdf-item__image {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 100%;
  margin-bottom: 2rem;
  text-align: center;
}

.pdf-item__image a {
  display: inline-block;
  max-width: 160px;
  border: 2px solid #22252A;
}

.pdf-item__image a:hover, .pdf-item__image a:focus {
  border-color: #F3B400;
}

.pdf-item__image img {
  width: 100%;
  height: auto;
  display: block;
}

@media (min-width: 768px) {
  .pdf-item__image {
    flex-basis: 200px;
    margin-right: 2.5rem;
    margin-bottom: 0;
  }
  .pdf-item__image a {
    max-width: none;
  }
}

@media (min-width: 992px) {
  .pdf-item__image {
    flex-basis: 200px;
  }
}

@media (min-width: 1200px) {
  .pdf-item__image {
    flex-basis: 250px;
  }
}

.pdf-item__content {
  display: flex;
  flex-direction: column;
}

.pdf-item__content .download-btn-wrap {
  margin-top: auto;
}

.intro-and-sectors .group--sector-teasers {
  width: 100%;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 100%;
  order: 2;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  height: 740px;
}

@media (min-width: 576px) {
  .intro-and-sectors .group--sector-teasers {
    height: 380px;
  }
}

@media (min-width: 992px) {
  .intro-and-sectors .group--sector-teasers {
    width: calc(50% - 1rem);
    flex-basis: calc(50% - 1rem);
    margin-right: 1rem;
    order: 1;
    height: auto;
  }
}

.intro-and-sectors .introduction {
  width: 100%;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 100%;
  order: 1;
  padding: 1rem 0;
}

@media (min-width: 992px) {
  .intro-and-sectors .introduction {
    width: calc(50% - 1rem);
    flex-basis: calc(50% - 1rem);
    margin-left: 1rem;
    order: 2;
    padding: 1.5rem 0;
  }
}

@media (min-width: 1200px) {
  .intro-and-sectors .introduction {
    padding: 2rem 0;
  }
}

.section-op {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
  padding: 1.5rem;
}

@media (min-width: 768px) {
  .section-op {
    padding: 1.5rem 3rem;
  }
}

@media (min-width: 992px) {
  .section-op {
    padding: 3rem 6rem;
  }
}

.section-op h2 {
  text-align: center;
  margin-bottom: 1rem;
}

@media (min-width: 992px) {
  .section-op h2 {
    margin-bottom: 2.5rem;
  }
}

.section-op.milestone-dashboard {
  background-image: url("../assets/background_image01.png");
}

.section-op.milestone-dashboard h2 {
  color: white;
}

.section-op.milestone-dashboard .group--milestones {
  width: 100%;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 100%;
}

@media (min-width: 768px) {
  .section-op.milestone-dashboard .group--milestones {
    width: calc(50% - 1rem);
    flex-basis: calc(50% - 1rem);
  }
  .section-op.milestone-dashboard .group--milestones--left {
    margin-right: 1rem;
  }
  .section-op.milestone-dashboard .group--milestones--right {
    margin-left: 1rem;
  }
}

.section-op.milestone-dashboard .legend {
  color: white;
  display: flex;
  flex-wrap: wrap;
  width: 340px;
  margin-left: auto;
  margin-top: 1rem;
}

.section-op.milestone-dashboard .legend span {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 100%;
  margin-bottom: 0.75rem;
}

.section-op.milestone-dashboard .legend ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
}

.section-op.milestone-dashboard .legend ul li {
  position: relative;
  padding: 0 1.5rem 0 36px;
  font-size: 1rem;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 100%;
  margin-bottom: 1rem;
}

@media (min-width: 468px) {
  .section-op.milestone-dashboard .legend ul li {
    margin-bottom: 0;
    flex-basis: auto;
  }
}

.section-op.milestone-dashboard .legend ul li:before {
  content: '';
  display: block;
  background-repeat: no-repeat;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
}

.section-op.milestone-dashboard .legend ul li:first-child:before {
  background-image: url("../assets/todo.svg");
}

.section-op.milestone-dashboard .legend ul li:nth-child(2):before {
  background-image: url("../assets/complete.svg");
}

.section-op.milestone-dashboard .legend ul li:last-child {
  padding-right: 0;
}

.section-op.milestone-dashboard .legend ul li:last-child:before {
  background-image: url("../assets/inprogress.svg");
}

.section-op.meaning {
  background-image: url("../assets/background_image02.png");
}

.section-op.meaning .group--sector-cards {
  display: flex;
  flex-wrap: wrap;
}

.section-op.roadmap {
  padding-bottom: 0;
}

.section-op.roadmap .roadmap-image img {
  width: 100%;
  height: auto;
  display: block;
}

.section-op.pdfs {
  background: #22252A;
  color: white;
}

.section-op.pdfs .col .pdf-item {
  margin-bottom: 2.5rem;
}

.section-op.pdfs .col .pdf-item:last-child {
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .section-op.related-content {
    padding: 3rem;
  }
}

@media (min-width: 992px) {
  .section-op.related-content {
    padding: 6rem;
  }
}

.section-op.related-content h2 {
  text-transform: none;
  text-align: left;
}

.image__layout {
  padding-top: 0px;
  padding-bottom: 15px;
}

.image__layout--full-width, .image__layout--boxed {
  display: block;
  clear: both;
}

.image__layout--full-width img, .image__layout--boxed img {
  width: 100%;
}

.image__layout--centered {
  display: block;
  text-align: center;
  padding-top: 25px;
  padding-bottom: 35px;
}

.image__layout--centered img {
  width: initial !important;
}

@media screen and (min-width: 769px) {
  .image__layout--align-left {
    float: left;
    clear: both;
    max-width: 50%;
    padding-right: 20px;
  }
  .image__layout--align-right {
    float: right;
    clear: both;
    max-width: 50%;
    padding-left: 20px;
  }
  .image__layout--pull-left {
    float: left;
    clear: both;
    max-width: 60%;
    margin-left: -25.8%;
    padding-right: 20px;
  }
  .image__layout--pull-right {
    float: right;
    clear: both;
    max-width: 60%;
    margin-right: -25.8%;
    padding-left: 20px;
  }
}

.image__caption {
  font-size: 14px;
  margin-top: 8px;
  display: block;
  line-height: 18px;
  color: #888;
}

.image__caption--full-width {
  text-align: center;
}

.layout--full-width, .layout--boxed {
  display: block;
  clear: both;
}

.layout--full-width img, .layout--boxed img {
  width: 100%;
}

.layout--centered {
  display: block;
  text-align: center;
  padding-top: 25px;
  padding-bottom: 35px;
}

.layout--centered img {
  width: initial !important;
}

@media screen and (min-width: 769px) {
  .layout--align-left {
    float: left;
    clear: both;
    max-width: 50%;
    padding-right: 20px;
  }
  .layout--align-right {
    float: right;
    clear: both;
    max-width: 50%;
    padding-left: 20px;
  }
  .layout--pull-left {
    float: left;
    clear: both;
    max-width: 66%;
    margin-left: -15%;
    padding-right: 30px;
  }
  .layout--pull-right {
    float: right;
    clear: both;
    max-width: 66%;
    margin-right: -15%;
    padding-left: 20px;
  }
}

.newsletter__main h1, .newsletter__main .h1 {
  font-size: calc(24px + 1vw);
  font-weight: bold;
}

.newsletter__main h2, .newsletter__main .h2 {
  font-size: calc(18px + 0.5vw);
  font-weight: bold;
  margin-bottom: 16px;
}

.newsletter__main h3, .newsletter__main .h3 {
  font-size: calc(13px + 0.5vw);
  margin-bottom: 16px;
  font-weight: bold;
}

.newsletter__main h4, .newsletter__main .h4 {
  font-size: calc(13px + 0.5vw);
  margin-bottom: 16px;
}

.newsletter__main h5, .newsletter__main .h5 {
  font-size: 15px;
  font-weight: bold;
  text-transform: uppercase;
  margin-bottom: 16px;
}

.newsletter__main p {
  font-size: calc(15px + 0.15vw);
  line-height: calc(24px + 0.15vw);
  margin-bottom: calc(20px + 0.15vw);
}

.newsletter__main p a {
  text-decoration: underline;
}

.newsletter__main ul {
  margin-bottom: 35px;
}

.newsletter__main li, .newsletter__main ol {
  font-size: calc(15px + 0.1vw);
  line-height: calc(24px + 0.1vw);
  margin-bottom: calc(5px + 0.1vw);
}

.newsletter__main a {
  color: #019D4E;
}

.newsletter__main img {
  max-width: 100%;
}

.newsletter__main blockquote {
  display: block;
  margin: 35px 0;
  border-left: 4px solid #019D4E;
  padding-left: 30px;
}

.newsletter__main blockquote p {
  font-size: 1.45em;
  line-height: calc(32px + 0.1vw);
  font-weight: bold;
}

.newsletter__main blockquote p u:last-of-type {
  display: block;
  text-decoration: none;
  font-size: 16px;
  margin-top: 10px;
  font-weight: normal;
}

h2.filter-label {
  font-size: calc(16px + 0.5vw);
  margin-bottom: 16px;
  background-color: #eee;
  display: inline-block;
  border-radius: 10px 10px 0 0;
  padding: 4px 20px;
}

.nl-tags {
  overflow: auto;
  max-height: calc(100vh - 160px);
}

.nl-tags li {
  margin-bottom: 5px;
}

.nl-tags a {
  display: inline-block;
  background-color: rgba(255, 255, 255, 0.2);
  padding: 0 10px;
  margin-left: -10px;
  border-radius: 15px;
  text-decoration: none;
  color: #555;
}

.nl-tags a p {
  font-size: calc(11px + 0.2vw);
  line-height: calc(14px + 0.12vw);
}

.nl-tags a:hover, .nl-tags a.active {
  background-color: rgba(225, 225, 225, 0.4);
}

.newsletter__list {
  background-color: #fff;
}

.newsletter__list a {
  color: #000;
}

.newsletter__list h2, .newsletter__list .h2 {
  font-size: calc(18px + 0.5vw);
  font-weight: bold;
  margin-bottom: 16px;
}

.newsletter__list .list__date {
  background-color: #019D41;
  font-weight: bold;
  color: #FFF;
  opacity: 1;
  padding: 2px;
  padding-left: 20px;
  padding-right: 18px;
  font-size: calc(11px + 0.2vw);
  margin-left: -20px;
  border-radius: 4px 16px 16px 4px;
}

.newsletter__list .list__date--video {
  background-color: #efefef;
  color: #333;
  text-transform: uppercase;
  padding-left: 13px;
  padding-right: 16px;
  margin-left: 6px;
  border-radius: 16px;
  text-decoration: none;
}

.newsletter__list .list__date--video svg {
  width: 15px;
  height: 15px;
  transform: translateY(2px);
}

.newsletter__list .list__date--video:hover {
  color: #fff;
  background-color: #019D4E;
}

.newsletter__list .list__item-tags li a {
  display: inline-block;
  background-color: rgba(255, 255, 255, 0.2);
  margin-right: 5px;
  padding: 2px 10px;
  border: 2px solid #eee;
  border-radius: 15px;
  text-decoration: none;
  color: #777;
}

.newsletter__list .list__item-tags li a p {
  font-size: calc(11px + 0.1vw);
  line-height: calc(18px + 0.1vw);
}

.newsletter__list .list__item-tags li a:hover {
  background-color: rgba(225, 225, 225, 0.4);
}

.newsletter__list .list__body {
  font-size: calc(16px + 0.1vw);
  line-height: calc(22px + 0.1vw);
  color: #555;
  text-decoration: none;
}

ul.nl-pagination li {
  padding: 5px 10px;
  font-size: calc(14px + 0.1vw);
  color: #ccc;
}

ul.nl-pagination li a {
  color: #019D4E;
}

#newsletter_nav {
  width: 100%;
  padding: 10px;
}

.newsletter__sidebar {
  position: -webkit-sticky;
  position: sticky;
  top: 120px;
}

.accordion-item {
  border-top: 1px solid #6E6C6C;
}

.accordion-item:last-child {
  border-bottom: 1px solid #6E6C6C;
}

.accordion-item.active .accordion-header:after {
  transform: translateY(-50%) rotate(180deg);
}

.accordion-item.active .accordion-content {
  max-height: 1000px;
}

.accordion-header {
  cursor: pointer;
  position: relative;
  padding-right: 70px;
}

@media screen and (min-width: 769px) {
  .accordion-header {
    padding-right: 80px;
  }
}

.accordion-header-text {
  max-width: 100%;
}

@media screen and (min-width: 769px) {
  .accordion-header-text {
    max-width: 550px;
  }
}

.accordion-header:after {
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%) rotate(0deg);
  width: 34px;
  height: 17px;
  background-image: url("../assets/chevron.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  transition: transform 0.2s ease-out 0.1s;
}

.accordion-content {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.3s ease-out;
  padding-right: 15px;
}

@media screen and (min-width: 769px) {
  .accordion-content {
    padding-right: 80px;
  }
}

body .accordion-content p, .accordion-content ul, .accordion-content li, .accordion-content a {
  font-size: 16px;
  font-size: 1rem;
}

.accordion-content li {
  margin-bottom: 15px;
}

.accordion-content blockquote p {
  font-size: 18px;
  font-size: 1.125rem;
  font-style: italic;
  font-weight: 500;
}

.accordion-image {
  margin: 10px 0 20px;
  width: 100%;
}

@media screen and (min-width: 769px) {
  .accordion-image {
    float: right;
    border-radius: 8px;
    margin-left: 40px;
    margin-bottom: 20px;
    width: 310px;
  }
}

body.scc-body #pageTop .scc {
  background-image: url(/site/themes/sona/assets/scc/lines-background.png);
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: 0 720px;
}

body.scc-body #pageTop .scc.scc-lower {
  background-position: 0 1320px;
}

.scc-limiter {
  position: relative;
  max-height: 3000px;
  transition: max-height 0.3s ease-in-out;
}

.scc-limiter__expand {
  position: absolute;
  bottom: 25px;
  left: 50%;
  transform: translateX(-50%) translateY(10px);
  border-radius: 30px;
  z-index: 3;
  border: none;
  box-shadow: -2px 2px 3px 0 rgba(0, 0, 0, 0.3);
  opacity: 0;
  pointer-events: none;
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

.scc-limiter--closed .scc-limiter__expand {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

.scc-limiter__expand:hover {
  background-color: #019D4E;
}

.scc-limiter:before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 50%, white 85%);
  z-index: 1;
  pointer-events: none;
  opacity: 0;
}

.scc-limiter--closed {
  max-height: 300px;
  overflow: hidden;
}

.scc-limiter--closed:before {
  pointer-events: auto;
  opacity: 1;
}

.scc-limiter--closed.scc-limiter--closed-large {
  max-height: 500px;
}

.scc-limiter--closed.scc-limiter--closed-large:before {
  height: 70%;
}

.back-to-top {
  opacity: 0;
  pointer-events: none;
  position: fixed;
  bottom: 10px;
  right: 20px;
  color: #fff;
  z-index: 999;
  background-color: #666;
  box-shadow: -2px 2px 3px 0 rgba(0, 0, 0, 0.3);
  padding: 5px 25px;
  border-radius: 15px;
  text-decoration: none;
}

.back-to-top.show {
  opacity: 1;
  pointer-events: auto;
}

.back-to-top:hover {
  color: #fff;
  text-decoration: none;
  background-color: #019D4E;
}

.scc .banner {
  min-height: 260px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center left;
}

.scc .banner__wrapper h1 {
  display: block;
  text-align: center;
  width: 100%;
  max-width: 570px;
  margin: 20px auto 0 auto !important;
}

@media (min-width: 968px) {
  .scc .banner__wrapper h1 {
    text-align: left;
    position: absolute;
    top: 30%;
    right: 10%;
    width: 30%;
    transform: translateY(-50%);
  }
}

@media (min-width: 968px) {
  .scc .banner__wrapper h1.full {
    text-align: left;
    bottom: 15%;
    right: 20px;
    top: initial;
    width: 45%;
    max-width: 1500px;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 10px;
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
  }
}

.scc .banner__wrapper h1.full span.front-home {
  display: block;
  font-size: 1.2rem;
  line-height: 1.6rem;
  font-weight: 600;
  margin-bottom: 10px;
  margin-top: 10px;
}

@media (min-width: 965px) {
  .scc .banner {
    min-height: 360px;
  }
}

.scc .banner--home {
  background-image: url(/site/themes/sona/assets/scc/home-bg.jpg);
  border-bottom: 50px solid #CECE99;
}

.scc .banner--focus {
  background-image: url(/site/themes/sona/assets/scc/focus-bg.jpg);
  border-bottom: 50px solid #ABAEC1;
}

.scc .banner--focus-item {
  background-image: url(/site/themes/sona/assets/scc/focus-item-bg.jpg);
  border-bottom: 50px solid #CECE99;
}

.scc .bg-loop-1 .bg-loop-sidebar, .scc .bg-loop-12 .bg-loop-sidebar {
  background-color: #fac462;
}

.scc .bg-loop-1 .action-block, .scc .bg-loop-12 .action-block {
  background-color: #fac462;
  border-left: 4px solid #ef9d07;
}

.scc .bg-loop-2 .bg-loop-sidebar, .scc .bg-loop-13 .bg-loop-sidebar {
  background-color: #ecdcbe;
}

.scc .bg-loop-2 .action-block, .scc .bg-loop-13 .action-block {
  background-color: #ecdcbe;
  border-left: 4px solid #dabc83;
}

.scc .bg-loop-3 .bg-loop-sidebar, .scc .bg-loop-14 .bg-loop-sidebar {
  background-color: #f6f1e8;
}

.scc .bg-loop-3 .action-block, .scc .bg-loop-14 .action-block {
  background-color: #f6f1e8;
  border-left: 4px solid #e1d0b1;
}

.scc .bg-loop-4 .bg-loop-sidebar, .scc .bg-loop-15 .bg-loop-sidebar {
  background-color: #dac3c2;
}

.scc .bg-loop-4 .action-block, .scc .bg-loop-15 .action-block {
  background-color: #dac3c2;
  border-left: 4px solid #bd9492;
}

.scc .bg-loop-5 .bg-loop-sidebar, .scc .bg-loop-16 .bg-loop-sidebar {
  background-color: #f1dfde;
}

.scc .bg-loop-5 .action-block, .scc .bg-loop-16 .action-block {
  background-color: #f1dfde;
  border-left: 4px solid #dbaaa8;
}

.scc .bg-loop-6 .bg-loop-sidebar, .scc .bg-loop-17 .bg-loop-sidebar {
  background-color: #babccc;
}

.scc .bg-loop-6 .action-block, .scc .bg-loop-17 .action-block {
  background-color: #babccc;
  border-left: 4px solid #8e92ab;
}

.scc .bg-loop-7 .bg-loop-sidebar, .scc .bg-loop-18 .bg-loop-sidebar {
  background-color: #e5e7f1;
}

.scc .bg-loop-7 .action-block, .scc .bg-loop-18 .action-block {
  background-color: #e5e7f1;
  border-left: 4px solid #b4b8d6;
}

.scc .bg-loop-8 .bg-loop-sidebar, .scc .bg-loop-19 .bg-loop-sidebar {
  background-color: #baccc5;
}

.scc .bg-loop-8 .action-block, .scc .bg-loop-19 .action-block {
  background-color: #baccc5;
  border-left: 4px solid #8eaba1;
}

.scc .bg-loop-9 .bg-loop-sidebar, .scc .bg-loop-20 .bg-loop-sidebar {
  background-color: #e4edea;
}

.scc .bg-loop-9 .action-block, .scc .bg-loop-20 .action-block {
  background-color: #e4edea;
  border-left: 4px solid #b6cfc6;
}

.scc .bg-loop-10 .bg-loop-sidebar, .scc .bg-loop-21 .bg-loop-sidebar {
  background-color: #c6c6c6;
}

.scc .bg-loop-10 .action-block, .scc .bg-loop-21 .action-block {
  background-color: #c6c6c6;
  border-left: 4px solid #a09f9f;
}

.scc .bg-loop-11 .bg-loop-sidebar, .scc .bg-loop-22 .bg-loop-sidebar {
  background-color: #e6e6e6;
}

.scc .bg-loop-11 .action-block, .scc .bg-loop-22 .action-block {
  background-color: #e6e6e6;
  border-left: 4px solid #c0bfbf;
}

.scc .part-title {
  position: relative;
  display: block;
}

.scc .part-title > span {
  background-color: #000;
  color: #fff;
  font-weight: bold;
  padding: 1px;
  text-transform: uppercase;
  width: 100%;
  display: block;
  position: absolute;
  top: 30%;
  left: 0;
  transform: translateY(-50%);
}

.scc .document .links a {
  border-radius: 5px;
  margin-bottom: 10px;
  display: flex;
  flex-wrap: wrap;
  justify-content: start;
  align-items: start;
  padding: 4px 15px;
  padding-left: 50px;
  border: 1px solid #fff;
  background-color: rgba(255, 255, 255, 0.3);
  color: #999;
  background-image: url(/site/themes/sona/assets/scc/download-icon.svg);
  background-repeat: no-repeat;
  background-position: 12px 5px;
}

.scc .document .links a strong {
  display: block;
  flex-shrink: 0;
}

.scc .document .links a strong ~ span {
  display: block;
  width: 75%;
}

.scc .document .links a:hover {
  background-color: rgba(255, 255, 255, 0.8);
}

.scc .search-input {
  z-index: 150;
}

.scc .search-input input {
  width: 600px;
  max-width: 95% !important;
  border: 0;
  border-radius: 0;
  border-bottom: 1px solid #efefef;
  padding: 0;
  padding-bottom: 0.5rem;
  padding-right: 100px;
  font-size: 1.5rem;
  font-weight: 300;
  color: #eee;
  background-color: #000 !important;
  background-image: url(/site/themes/sona/assets/scc/mag.svg);
  background-repeat: no-repeat;
  background-position: calc(100% - 15px) center;
  background-size: 30px;
  transition: border-bottom-color 0.2s ease-in-out;
}

.scc .search-input input:-ms-input-placeholder {
  color: #999;
}

.scc .search-input input::placeholder {
  color: #999;
}

.scc .search-input input:focus {
  border-bottom-color: green;
  outline: none;
}

.scc .search-input .algolia-autocomplete {
  width: 600px;
  max-width: 95% !important;
  z-index: 300;
}

.scc .search-input .aa-dropdown-menu {
  max-width: 95%;
  background-color: #fff;
  margin-left: 2.5%;
  z-index: 300;
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  max-height: 80vh;
  overflow-y: auto;
  padding: 10px 0;
}

.scc .search-input .aa-dropdown-menu p {
  font-size: 14px;
  line-height: calc(14px + 4.2px);
}

@media screen and (min-width: 376px) {
  .scc .search-input .aa-dropdown-menu p {
    font-size: calc(14px + 1 * ((100vw - 376px) / 794));
    line-height: calc(14px + 1 * ((100vw - 376px) / 794) + 4.2px);
  }
}

@media screen and (min-width: 1170px) {
  .scc .search-input .aa-dropdown-menu p {
    font-size: 15px;
    line-height: calc(15px + 4.5px);
  }
}

.scc .search-input .aa-suggestion {
  padding: 0;
  margin: 0;
  border-bottom: 1px solid #efefef;
}

.scc .search-input .aa-suggestion p, .scc .search-input .aa-suggestion div {
  padding: 0;
  margin: 0;
}

.scc .search-input .aa-suggestion em {
  background-color: #00FF00;
}

.scc .search-input .search-result {
  margin: 0;
  padding: 0;
}

.scc .search-input .search-result-link {
  display: block;
  margin: 0;
  padding: 10px 20px;
  color: #888;
  text-decoration: none;
}

.scc .search-input .search-result-link:hover {
  color: #111;
  background-color: #efefef;
}

.scc .help-text {
  display: none;
  background-color: white;
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.3);
  border: 2px solid #ccc;
  border-radius: 10px;
  padding: 10px 20px;
  position: absolute;
  top: calc(100% + 20px);
  width: 90%;
  left: 50%;
  transform: translateX(-50%);
}

.scc .help-text:before {
  content: '';
  position: absolute;
  bottom: 100%;
  right: 10%;
  transform: translateX(-50%);
  border: 20px solid transparent;
  border-bottom-color: #ccc;
}

@media (min-width: 968px) {
  .scc .help-text {
    width: 50%;
  }
}

.scc .help-text p {
  margin: 0;
  padding: 0;
  font-size: 1em;
  line-height: 1.4rem;
  margin-bottom: 5px;
  margin-top: 5px;
}

.scc h1, .scc .h1, .scc h2, .scc .h2, .scc h3, .scc .h3, .scc h4, .scc .h4, .scc h5, .scc .h5, .scc h6, .scc .h6 {
  font-family: "Montserrat", sans-serif;
  font-weight: 800 !important;
  line-height: 1.2;
  margin-bottom: 1.5rem;
  margin-top: 0;
}

.scc .display-4 {
  font-size: 36px;
  line-height: calc(36px + 7.2px);
}

@media screen and (min-width: 376px) {
  .scc .display-4 {
    font-size: calc(36px + 19 * ((100vw - 376px) / 794));
    line-height: calc(36px + 19 * ((100vw - 376px) / 794) + 7.2px);
  }
}

@media screen and (min-width: 1170px) {
  .scc .display-4 {
    font-size: 55px;
    line-height: calc(55px + 11px);
  }
}

.scc h1, .scc .h1 {
  font-size: 36px;
  line-height: calc(36px + 7.2px);
}

@media screen and (min-width: 376px) {
  .scc h1, .scc .h1 {
    font-size: calc(36px + 9 * ((100vw - 376px) / 794));
    line-height: calc(36px + 9 * ((100vw - 376px) / 794) + 7.2px);
  }
}

@media screen and (min-width: 1170px) {
  .scc h1, .scc .h1 {
    font-size: 45px;
    line-height: calc(45px + 9px);
  }
}

.scc h2, .scc .h2 {
  font-size: 32px;
  line-height: calc(32px + 6.4px);
}

@media screen and (min-width: 376px) {
  .scc h2, .scc .h2 {
    font-size: calc(32px + 8 * ((100vw - 376px) / 794));
    line-height: calc(32px + 8 * ((100vw - 376px) / 794) + 6.4px);
  }
}

@media screen and (min-width: 1170px) {
  .scc h2, .scc .h2 {
    font-size: 40px;
    line-height: calc(40px + 8px);
  }
}

.scc h3, .scc .h3 {
  font-size: 26px;
  line-height: calc(26px + 5.2px);
}

@media screen and (min-width: 376px) {
  .scc h3, .scc .h3 {
    font-size: calc(26px + 9 * ((100vw - 376px) / 794));
    line-height: calc(26px + 9 * ((100vw - 376px) / 794) + 5.2px);
  }
}

@media screen and (min-width: 1170px) {
  .scc h3, .scc .h3 {
    font-size: 35px;
    line-height: calc(35px + 7px);
  }
}

.scc h4, .scc .h4 {
  font-size: 22px;
  line-height: calc(22px + 4.4px);
}

@media screen and (min-width: 376px) {
  .scc h4, .scc .h4 {
    font-size: calc(22px + 8 * ((100vw - 376px) / 794));
    line-height: calc(22px + 8 * ((100vw - 376px) / 794) + 4.4px);
  }
}

@media screen and (min-width: 1170px) {
  .scc h4, .scc .h4 {
    font-size: 30px;
    line-height: calc(30px + 6px);
  }
}

.scc h5, .scc .h5 {
  font-size: 16px;
  line-height: calc(16px + 3.2px);
}

@media screen and (min-width: 376px) {
  .scc h5, .scc .h5 {
    font-size: calc(16px + 9 * ((100vw - 376px) / 794));
    line-height: calc(16px + 9 * ((100vw - 376px) / 794) + 3.2px);
  }
}

@media screen and (min-width: 1170px) {
  .scc h5, .scc .h5 {
    font-size: 25px;
    line-height: calc(25px + 5px);
  }
}

.scc h6, .scc .h6 {
  font-size: 14px;
  line-height: calc(14px + 2.8px);
}

@media screen and (min-width: 376px) {
  .scc h6, .scc .h6 {
    font-size: calc(14px + 6 * ((100vw - 376px) / 794));
    line-height: calc(14px + 6 * ((100vw - 376px) / 794) + 2.8px);
  }
}

@media screen and (min-width: 1170px) {
  .scc h6, .scc .h6 {
    font-size: 20px;
    line-height: calc(20px + 4px);
  }
}

.scc p, .scc li {
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: calc(14px + 7px);
}

@media screen and (min-width: 376px) {
  .scc p, .scc li {
    font-size: calc(14px + 4 * ((100vw - 376px) / 794));
    line-height: calc(14px + 4 * ((100vw - 376px) / 794) + 7px);
  }
}

@media screen and (min-width: 1170px) {
  .scc p, .scc li {
    font-size: 18px;
    line-height: calc(18px + 9px);
  }
}

.scc p.lead, .scc li.lead {
  font-size: 16px;
  line-height: calc(16px + 8px);
  font-weight: 200 !important;
}

@media screen and (min-width: 376px) {
  .scc p.lead, .scc li.lead {
    font-size: calc(16px + 6 * ((100vw - 376px) / 794));
    line-height: calc(16px + 6 * ((100vw - 376px) / 794) + 8px);
  }
}

@media screen and (min-width: 1170px) {
  .scc p.lead, .scc li.lead {
    font-size: 22px;
    line-height: calc(22px + 11px);
  }
}

.scc span.small {
  font-size: 10px;
  line-height: calc(10px + 2px);
}

@media screen and (min-width: 376px) {
  .scc span.small {
    font-size: calc(10px + 4 * ((100vw - 376px) / 794));
    line-height: calc(10px + 4 * ((100vw - 376px) / 794) + 2px);
  }
}

@media screen and (min-width: 1170px) {
  .scc span.small {
    font-size: 14px;
    line-height: calc(14px + 2.8px);
  }
}

.scc #chart .chart-svg {
  width: 100%;
  height: 100%;
  display: block;
  margin: 0 auto;
}

.scc #piechart g {
  cursor: pointer;
}

html {
  scroll-padding-top: 120px;
}

.ministerialUpdate--select {
  border-radius: 4px;
  border: 0.5px solid #C7C7C7;
  background: #F0F0F0;
  text-align: center;
  padding: 7px 10px;
}

@media screen and (min-width: 769px) {
  .ministerialUpdate--select {
    min-width: 140px;
  }
}

.ministerialUpdate--list {
  max-width: 340px;
  padding: 10px;
  border-radius: 5px;
  background: #FFF;
  box-shadow: 0px 4px 9.2px 0px rgba(0, 0, 0, 0.1);
}

.ministerialUpdate--list .downloadIcon {
  height: 26px;
}

.cornerFlag {
  position: absolute;
  top: 0;
  left: 0;
  width: 78px;
  height: 89px;
  background-image: url("/img/necom/dashboard/flag-corner.png");
  background-position: top left;
  background-size: contain;
  background-repeat: no-repeat;
}

.centerGavel {
  min-height: 100px;
  max-height: 140px;
  width: 100%;
  background-image: url("/img/necom/dashboard/gavel.png");
  background-position: bottom center;
  background-size: contain;
  background-repeat: no-repeat;
}

@media screen and (min-width: 769px) {
  .keepInline {
    white-space: nowrap;
  }
}

.takeChargeVideo {
  position: relative;
  display: block;
  width: 100%;
  background-color: #000;
  padding-top: 50%;
  height: 100%;
  border-radius: 10px;
  background-image: url("/img/necom/bulb-darker.jpg");
  background-position: center;
  background-size: cover;
}

.takeChargeVideo:before {
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: scale(1) translateY(-50%) translateX(-50%);
  transform-origin: top left;
  width: 120px;
  height: 120px;
  background-image: url("/img/necom/icons/Youtube-icon.svg");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  transition: transform 0.3s ease-in-out;
}

.takeChargeVideo:hover:before {
  transform: scale(1.1) translateY(-50%) translateX(-50%);
}

.EveryClickCounts--img {
  position: relative;
  display: block;
  width: 100%;
  border-radius: 10px;
  color: #fff;
  padding-top: 50%;
  background-size: cover;
  background-position: center;
  overflow: hidden;
}

.EveryClickCounts--img:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.4);
}

.EveryClickCounts--imgContent {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 15px 35px;
}

@media screen and (min-width: 769px) {
  .pullBG .bg-row {
    padding: 0 90px;
    margin: 0 -90px;
  }
}

.pullBG .bg-row--grey {
  background-color: #F0F0F0;
}

@media screen and (min-width: 769px) {
  .pullBG .bg-row--grey {
    border-radius: 10px;
  }
}

.pullBG .bg-row--dark {
  background-color: #000;
  color: #fff;
}

@media screen and (min-width: 769px) {
  .pullBG .bg-row--dark {
    border-radius: 10px;
  }
}

.pullBG .pullWrapper {
  padding-bottom: 40px;
}

@media screen and (min-width: 769px) {
  .pullBG .pullWrapper {
    padding-bottom: 0;
  }
}

@media screen and (min-width: 769px) {
  .pullBG__y .bg-row {
    margin: 100px -90px;
  }
}

@media screen and (min-width: 769px) {
  .pullBG__y .pullWrapper {
    margin: -100px 0;
  }
}

.actionPlanCard {
  border-radius: 24px;
  border: 1px solid #FFF;
  background: rgba(111, 111, 111, 0.3);
  -webkit-backdrop-filter: blur(7.5px);
  backdrop-filter: blur(7.5px);
  padding: 20px 40px;
  text-align: center;
  height: 100%;
}

.actionPlanCard--index {
  text-align: right;
}

.actionPlanCard--index span {
  display: inline-block;
  border-radius: 50px;
  background: rgba(255, 255, 255, 0.26);
  min-width: 65px;
  text-align: center;
  font-size: 14px;
  padding: 5px;
}

.actionPlanCard--heading, .actionPlanCard--link {
  color: #C7C7C7 !important;
  font-size: 20px;
  text-decoration: none !important;
  font-weight: 300;
}

.actionPlanCard--heading:hover, .actionPlanCard--link:hover {
  text-decoration: none !important;
}

.actionPlanCard--spacer {
  flex-grow: 1;
}

.actionPlanCard h4 {
  line-height: 1.4 !important;
}

.minister__block {
  position: relative;
  overflow: hidden;
  transition: transform 0.3s ease-in-out;
}

.minister__block--active-blue .minister__block--blue {
  position: relative;
  transform: translateX(0);
  transition: transform 0.3s ease-in-out;
}

.minister__block--active-blue .minister__block--orange {
  top: 0;
  position: absolute;
  transform: translateX(100%);
  transition: transform 0.3s ease-in-out;
}

.minister__block--active-orange .minister__block--blue {
  top: 0;
  position: absolute;
  transform: translateX(-100%);
  transition: transform 0.3s ease-in-out;
}

.minister__block--active-orange .minister__block--orange {
  position: relative;
  transform: translateX(0);
  transition: transform 0.3s ease-in-out;
}

.minister__block--orange {
  position: absolute;
  top: 0;
  width: 100%;
  border-radius: 15px;
  overflow: hidden;
  border: 4px solid #FAB330 !important;
}

.minister__block--orange .minister__col-head {
  background-color: #F9D490;
}

.minister__block--orange .minister__footer {
  background-color: #FAB330;
}

.minister__block--orange .minister__footer:hover {
  background-color: #fcc152;
  cursor: pointer;
}

.minister__block--blue {
  position: absolute;
  top: 0;
  width: 100%;
  border: 4px solid #1A2047 !important;
  border-radius: 15px;
  overflow: hidden;
}

.minister__block--blue .minister__col-head {
  background-color: #D3D7E4;
}

.minister__block--blue .minister__footer {
  background-color: #1A2047;
  color: #fff !important;
}

.minister__block--blue .minister__footer:hover {
  background-color: #292f58;
  cursor: pointer;
}

.minister__block--blue .minister__col {
  max-height: 1000px;
  border: none;
}

.minister__block--blue .minister__col img {
  border: 1px solid #eee;
}

.minister__block--blue .minister__col .small {
  font-size: 12px !important;
}

.minister__block--blue .minister__col a {
  text-decoration: none !important;
}

.minister__col {
  overflow: auto;
  max-height: 220px;
  border-left: 1px solid #ccc;
  border-top: 1px solid #ccc;
}

.minister__col-head {
  font-size: 16px !important;
  text-transform: uppercase;
  text-align: center;
  margin: 0;
  border-left: 1px solid #ccc;
}

.minister__ltst {
  text-transform: uppercase;
  font-size: 13px !important;
}

.minister__img {
  position: absolute;
  bottom: 0;
  right: 75px;
  pointer-events: none;
}

.minister__mth {
  background-color: #efefef;
  padding: 5px 0;
  font-size: 12px !important;
  text-transform: uppercase;
  font-weight: bold;
  margin: 0;
  border-bottom: 1px solid #ccc;
  display: none;
}

.minister__rpt {
  border-bottom: 1px solid #ddd;
}

.minister__footer {
  padding: 15px 20px;
  display: block;
}

.minister__footer .link-text {
  font-size: 20px !important;
  display: inline-block;
  background-image: url("/img/chev-left.svg");
  background-repeat: no-repeat;
  background-position: 0 50%;
  text-decoration: none !important;
  color: #000;
}

.minister__footer .link-text--r {
  background-image: url("/img/chev-right.svg");
  background-position: 100% 50%;
}

.ministerialUpdate--monthWrapper {
  position: relative;
  width: 100%;
  flex-direction: column;
  gap: 8px;
}

.ringBG {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.ringBG--wrapper {
  position: relative;
  overflow: hidden;
}

.ringBG--ring {
  position: absolute;
  top: 0;
  right: 0;
}

.ringBG--ring2 {
  position: absolute;
  bottom: 0;
  right: 0;
}

.content-pyei h1, .content-pyei .h1 {
  font-size: 40px;
  font-size: 2.5rem;
  font-weight: bold;
}

@media screen and (min-width: 769px) {
  .content-pyei h1, .content-pyei .h1 {
    font-size: 50px;
    font-size: 3.125rem;
  }
}

.content-pyei h2, .content-pyei .h2 {
  font-size: 26px;
  font-size: 1.625rem;
  font-weight: bold;
}

@media screen and (min-width: 769px) {
  .content-pyei h2, .content-pyei .h2 {
    font-size: 32px;
    font-size: 2rem;
  }
}

.content-pyei h3, .content-pyei .h3 {
  text-transform: unset;
  font-size: 24px;
  font-size: 1.5rem;
  font-weight: bold;
}

@media screen and (min-width: 769px) {
  .content-pyei h3, .content-pyei .h3 {
    font-size: 30px;
    font-size: 1.875rem;
  }
}

.content-pyei h4, .content-pyei .h4 {
  font-size: 18px;
  font-size: 1.125rem;
}

@media screen and (min-width: 769px) {
  .content-pyei h4, .content-pyei .h4 {
    font-size: 22px;
    font-size: 1.375rem;
  }
}

.content-pyei p, .content-pyei span {
  font-size: 16px;
  font-size: 1rem;
}

@media screen and (min-width: 769px) {
  .content-pyei p, .content-pyei span {
    font-size: 19px;
    font-size: 1.1875rem;
  }
}

.content-pyei a {
  color: #308765;
  text-decoration: underline;
}

.content-pyei a:hover {
  color: #308765;
  text-decoration: underline;
}

.content-pyei h1 {
  font-family: 'Poppins', sans-serif;
  text-transform: none;
}

.content-pyei p {
  text-align: justify;
}

.content-pyei p.lead {
  font-size: 24px;
}

.content-pyei .sectionHeader {
  font-family: 'Poppins', sans-serif;
  display: inline;
}

.content-pyei .sectionHeader_wrapper {
  padding: 10px 10px 30px;
}

.content-pyei .sectionHeader,
.content-pyei .orangeHeader {
  background-color: #ea6a4e;
  color: #fff;
  display: inline;
  text-transform: initial !important;
  padding: 0;
  margin-bottom: 0;
  line-height: 1.6em;
  box-shadow: -10px 0 0 #ea6a4e, 10px 0 0 #ea6a4e;
}

.content-pyei .pageColor-blue .sectionHeader,
.content-pyei h3.sectionHeader.blueHeader {
  background-color: #415A90;
  box-shadow: -10px 0 0 #415A90, 10px 0 0 #415A90;
}

.content-pyei .pageColor-green .sectionHeader,
.content-pyei h3.sectionHeader.greenHeader {
  background-color: #308765;
  box-shadow: -10px 0 0 #308765, 10px 0 0 #308765;
}

.content-pyei .pageColor-yellow .sectionHeader,
.content-pyei h3.sectionHeader.yellowHeader {
  background-color: #FCB524;
  box-shadow: -10px 0 0 #FCB524, 10px 0 0 #FCB524;
}

.content-pyei h3.sectionHeader.whiteHeader {
  color: #415A90;
  background-color: #FFF;
  box-shadow: -10px 0 0 #FFF, 10px 0 0 #FFF;
}

.content-pyei .pyeiPageTitle--max {
  max-width: 1100px;
}

.content-pyei .pyeiHero {
  margin-bottom: 30px;
}

.content-pyei .pyeiHero-linkList {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1020;
  text-align: left;
}

@media screen and (min-width: 769px) {
  .content-pyei .pyeiHero-linkList {
    text-align: center;
    display: flex;
    gap: 2px;
  }
}

.content-pyei .pyeiHero-links {
  display: flex;
  align-items: center;
  justify-content: space-around;
  width: 100%;
  color: #fff;
  font-weight: bold;
  background-color: #000;
  text-align: center;
  padding: 10px;
  font-size: 15px;
  line-height: 20px;
  text-decoration: none;
}

.content-pyei .pyeiHero-links.active {
  background-color: #00774b;
}

.content-pyei .pyeiHero-links:hover {
  color: #fff;
  background-color: #00764b;
  text-decoration: none;
}

.content-pyei .pyeiHero__logo {
  max-width: 65%;
}

@media screen and (min-width: 769px) {
  .content-pyei .pyeiHero__logo {
    max-width: 20%;
  }
}

.content-pyei .pyeiHero__intro {
  max-width: 100%;
}

@media screen and (min-width: 769px) {
  .content-pyei .pyeiHero__intro {
    max-width: 50%;
    margin: -20px 0 -30px 0;
  }
}

.content-pyei .pyeiHero__image {
  display: none;
}

@media screen and (min-width: 769px) {
  .content-pyei .pyeiHero__image {
    display: block;
    width: 55%;
    position: absolute;
    right: 14px;
    top: 0;
    bottom: 0;
    background-image: url(/assets/pyei/header-image2.png);
    background-position: bottom right;
    background-size: contain;
    background-repeat: no-repeat;
  }
}

@media screen and (max-width: 769px) {
  .content-pyei .pinMenu__inner {
    transition: max-height 0.4s ease-in-out;
    max-height: 0;
    overflow: hidden;
  }
  .menu-open .content-pyei .pinMenu__inner {
    max-height: 100vh;
    overflow: auto;
  }
}

@media screen and (min-width: 769px) {
  .is-pinned .content-pyei .pinMenu__inner {
    position: fixed;
    top: -1px;
    z-index: 100;
    max-width: 1310px;
    background-color: #fff;
  }
}

@media screen and (min-width: 769px) and (min-width: 769px) {
  .content-pyei .pinMenu__wrapper {
    min-height: 61px;
  }
}

.content-pyei .sectionBg {
  background-color: #308765;
  color: #fff;
}

.content-pyei .sectionBg a {
  color: #fff;
}

.content-pyei .sectionBg--bars {
  position: relative;
}

.content-pyei .sectionBg--bars:before {
  content: '';
  position: absolute;
  width: 50px;
  left: 0;
  top: 35px;
  bottom: 35px;
  background-image: url(/assets/pyei/stripes_bg-tile@2x.png);
  background-size: 35%;
  opacity: 0.7;
}

.content-pyei .pageColor-blue .sectionBg {
  background-color: #415A90;
}

.content-pyei .pageColor-green .sectionBg {
  background-color: #308765;
}

.content-pyei .pageColor-yellow .sectionBg {
  background-color: #FCB524;
}

.content-pyei .resultsIframe {
  height: 100%;
  width: 100%;
}

.content-pyei .resultsIframe_wrapper {
  position: relative;
  padding-top: 60%;
  max-height: calc(100vh - 100px);
  display: block;
}

.content-pyei .resultsIframe_content {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
}

.content-pyei .arrowList {
  list-style: none;
  padding: 0;
  margin: 0;
}

.content-pyei .arrowList li {
  padding-left: 30px;
  position: relative;
}

.content-pyei .arrowList li:before {
  content: '';
  position: absolute;
  top: 7px;
  left: 0;
  width: 0;
  height: 0;
  border: 10px solid transparent;
  border-left: 15px solid #FCB524;
}

.content-pyei .iconList_item {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 30px;
}

.content-pyei .iconList_item:not(:last-of-type) .iconList_content {
  margin-bottom: 25px;
  padding-bottom: 25px;
  border-bottom: 3px dotted #415A90;
}

.content-pyei .iconList_img {
  flex-grow: 0;
  flex-shrink: 0;
  width: 75px;
}

.content-pyei .iconList_content {
  width: 100%;
  min-height: 90px;
}

.content-pyei .iconList_content p:last-of-type {
  margin: 0;
}

.content-pyei .keyList {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
}

.content-pyei .keyList_item {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 20px;
  width: 100%;
}

@media screen and (min-width: 769px) {
  .content-pyei .keyList_item {
    width: 48%;
  }
}

@media screen and (min-width: 992px) {
  .content-pyei .keyList_item {
    width: 30%;
  }
}

.content-pyei .keyList_img {
  flex-grow: 0;
  flex-shrink: 0;
  width: 50px;
}

.content-pyei .keyList_content {
  width: 100%;
}

.content-pyei .keyList_content p {
  margin: 0;
  text-align: left;
}

.content-pyei .blockItem {
  background-color: #BDBDBD;
  padding-top: 100%;
  margin-bottom: 2em;
}

.content-pyei .blockItem_list > div:nth-of-type(3n-2) .blockItem {
  background-color: #BDBDBD;
}

.content-pyei .blockItem_list > div:nth-of-type(3n-1) .blockItem {
  background-color: #D3D3D3;
}

.content-pyei .blockItem_list > div:nth-of-type(3n) .blockItem {
  background-color: #EEE;
}

.content-pyei .pyeiDownload_icon {
  width: 60px;
  transition: transform 0.6s cubic-bezier(0.47, 1.64, 0.41, 0.8);
}

@media screen and (min-width: 769px) {
  .content-pyei .pyeiDownload_icon {
    width: 90px;
  }
}

.content-pyei .pyeiDownload_content {
  position: relative;
}

.content-pyei .pyeiDownload_content:before {
  content: '';
  display: block;
  opacity: 1;
  position: absolute;
  height: auto;
  top: 0;
  right: 0;
  left: 0;
  width: 100%;
  background-image: url("/assets/pyei/stripes_bg-tile.png");
  height: 130px;
}

@media screen and (min-width: 769px) {
  .content-pyei .pyeiDownload_content {
    padding-left: 90px;
  }
  .content-pyei .pyeiDownload_content:before {
    height: auto;
    right: initial;
    bottom: 0;
    left: 90px;
    width: 25%;
  }
}

@media screen and (min-width: 992px) {
  .content-pyei .pyeiDownload_content.smaller {
    padding-left: 30px;
  }
  .content-pyei .pyeiDownload_content.smaller:before {
    height: auto;
    right: initial;
    bottom: 0;
    left: 30px;
    width: 10px;
  }
}

.content-pyei .pyeiDownload_head, .content-pyei .pyeiDownload_body {
  padding: 20px;
}

@media screen and (min-width: 769px) {
  .content-pyei .pyeiDownload_head, .content-pyei .pyeiDownload_body {
    padding: 20px 20px 20px 30%;
  }
}

@media screen and (min-width: 992px) {
  .content-pyei .pyeiDownload_head.smaller, .content-pyei .pyeiDownload_body.smaller {
    padding: 20px 20px 20px 20px;
  }
}

.content-pyei .pyeiDownload_head {
  color: #000;
  background-color: #FCB524;
}

@media screen and (max-width: 768px) {
  .content-pyei .pyeiDownload_head {
    padding-top: 150px;
  }
}

.content-pyei .pyeiDownload_body {
  background-color: #00774b;
}

.content-pyei .pyeiDownload_mainImage {
  display: block;
  width: 250px;
  position: relative;
  top: 0;
  left: 0;
  z-index: 1;
  margin: 0 auto -80px;
  transform: rotate(350deg);
  box-shadow: 5px 5px 35px -8px rgba(0, 0, 0, 0.3);
}

@media screen and (min-width: 769px) {
  .content-pyei .pyeiDownload_mainImage {
    width: 200px;
    margin: 0;
    position: absolute;
    top: 50%;
    left: 40px;
    transform: translateY(-50%) rotate(350deg);
  }
}

@media screen and (min-width: 992px) {
  .content-pyei .pyeiDownload_mainImage {
    width: 240px;
  }
  .content-pyei .pyeiDownload_mainImage.smaller {
    width: 200px;
    position: relative;
    transform: none;
    left: 50%;
    transform: translateX(-50%) rotate(350deg);
  }
}

.content-pyei .pyeiDownload h3 {
  font-size: 28px;
  font-size: 1.75rem;
}

@media screen and (min-width: 769px) {
  .content-pyei .pyeiDownload h3 {
    font-size: 38px;
    font-size: 2.375rem;
  }
}

.content-pyei .pyeiDownload_inner {
  display: block;
  padding: 30px 0;
  text-decoration: none;
}

.content-pyei .pyeiDownload_inner:hover {
  text-decoration: none;
}

.content-pyei .pyeiDownload_inner:hover .pyeiDownload_icon {
  transform: scale(1.1);
}

@media screen and (min-width: 769px) {
  .content-pyei .pyeiDownload_inner {
    padding: 90px 0;
  }
}

.content-pyei .pyeiForm_inputWrapper label {
  display: none;
}

.content-pyei .pyeiForm_inputWrapper textarea,
.content-pyei .pyeiForm_inputWrapper select,
.content-pyei .pyeiForm_inputWrapper input {
  width: 100%;
  border: 1px solid #aaa;
  box-shadow: none;
  outline: 0;
  color: #212529;
  font-size: 20px;
  font-size: 1.25rem;
  margin-bottom: 15px;
  padding: 10px;
}

.content-pyei .pyeiForm_inputWrapper textarea:-ms-input-placeholder,
.content-pyei .pyeiForm_inputWrapper select:-ms-input-placeholder,
.content-pyei .pyeiForm_inputWrapper input:-ms-input-placeholder {
  color: #aaa;
}

.content-pyei .pyeiForm_inputWrapper textarea::placeholder,
.content-pyei .pyeiForm_inputWrapper select::placeholder,
.content-pyei .pyeiForm_inputWrapper input::placeholder {
  color: #aaa;
}

.content-pyei .pyeiForm_inputWrapper select {
  -webkit-appearance: none;
  -moz-appearance: none;
  background: transparent;
  background-image: url("data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");
  background-repeat: no-repeat;
  background-position-x: calc(100% - 15px);
  background-position-y: 45%;
}

.content-pyei .pyeiForm_inputWrapper.organisationType_wrapper.isPlaceholder select {
  color: #aaa;
}

.content-pyei .pyeiForm__submitButton {
  background-color: #308765;
  border-radius: 50px;
  padding: 5px 30px;
  font-weight: bold;
  font-size: 18px;
  color: #fff;
  text-transform: uppercase;
  display: block;
  width: 230px;
}

.container-fluid--dashboard {
  max-width: 1800px;
}

.content-clicktosave {
  background-color: #FBFBFB;
}

.content-clicktosave .fade-up--1 {
  animation: fadeInUp 0.8s 0s;
  animation-fill-mode: both;
}

.content-clicktosave .fade-up--2 {
  animation: fadeInUp 0.8s 0.25s;
  animation-fill-mode: both;
}

.content-clicktosave .fade-up--3 {
  animation: fadeInUp 0.8s 0.4s;
  animation-fill-mode: both;
}

.content-clicktosave .fade-up--4 {
  animation: fadeInUp 0.8s 0.5s;
  animation-fill-mode: both;
}

.content-clicktosave .fade-up--5 {
  animation: fadeInUp 0.8s 0.6s;
  animation-fill-mode: both;
}

.content-clicktosave .fade-up--6 {
  animation: fadeInUp 0.8s 0.7s;
  animation-fill-mode: both;
}

.content-clicktosave .fade-up--7 {
  animation: fadeInUp 0.8s 0.8s;
  animation-fill-mode: both;
}

.content-clicktosave .fade-up--8 {
  animation: fadeInUp 0.8s 0.9s;
  animation-fill-mode: both;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(50px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.content-clicktosave .btn.svg-tilt svg {
  vertical-align: middle;
  margin-top: -3px;
  transform: rotate(0deg);
  transition: transform 0.2s ease-in-out;
}

.content-clicktosave .btn.svg-tilt:hover svg {
  transform: rotate(-35deg);
  opacity: 0.8;
}

.content-clicktosave .btn-red {
  background-color: #DB3B38 !important;
  text-decoration: none;
}

.content-clicktosave .btn-red:hover {
  text-decoration: none;
  background-color: #c8302d !important;
  color: #fff;
}

.content-clicktosave .btn-yellow {
  background-color: #F9B32D !important;
  color: #333;
  text-decoration: none;
}

.content-clicktosave .btn-yellow:hover {
  text-decoration: none;
  background-color: #f2ad2c !important;
  color: #FFF !important;
  opacity: 1 !important;
}

.content-clicktosave .btn-yellow:hover svg {
  color: #FFF !important;
  opacity: 1 !important;
}

.content-clicktosave .btn-necom {
  font-size: 16px;
  line-height: calc(16px + 3.2px);
  padding: 20px 45px;
  text-decoration: none;
  color: #FFF;
  background-color: #000;
  border-radius: 15px !important;
  transform: translateY(0);
}

@media screen and (min-width: 376px) {
  .content-clicktosave .btn-necom {
    font-size: calc(16px + 8 * ((100vw - 376px) / 794));
    line-height: calc(16px + 8 * ((100vw - 376px) / 794) + 3.2px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave .btn-necom {
    font-size: 24px;
    line-height: calc(24px + 4.8px);
  }
}

.content-clicktosave .btn-necom--sml {
  padding: 10px 20px 6px 20px;
  font-size: 14px;
  line-height: calc(14px + 2.8px);
}

@media screen and (min-width: 376px) {
  .content-clicktosave .btn-necom--sml {
    font-size: calc(14px + 4 * ((100vw - 376px) / 794));
    line-height: calc(14px + 4 * ((100vw - 376px) / 794) + 2.8px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave .btn-necom--sml {
    font-size: 18px;
    line-height: calc(18px + 3.6px);
  }
}

.content-clicktosave .btn-necom--sml .lbulb {
  margin-bottom: 4px;
}

.content-clicktosave .btn-necom--dark {
  background-color: #FFF;
  color: #000;
}

.content-clicktosave .btn-necom--dark svg {
  margin-left: 10px;
  vertical-align: text-bottom;
  transform: translateY(-2px);
}

.content-clicktosave .btn-necom--dark:hover {
  transform: translateY(-5px);
  background-color: #F9B32D;
  color: #FFF !important;
}

.content-clicktosave .btn-necom--yellow {
  background-color: #F9B32D;
  color: #fff;
}

.content-clicktosave .btn-necom--yellow:hover {
  background-color: #000;
  color: #FFF !important;
}

.content-clicktosave .btn-necom .lbulb {
  display: inline-block;
  vertical-align: middle;
  width: 27px;
  height: 31.5px;
  margin-left: 11px;
  background-image: url("/img/necom/buld-device.png");
  background-size: 200%;
  background-position: top left;
}

.content-clicktosave .btn-necom:hover {
  text-decoration: none;
  color: #F9B32D;
  transform: translateY(-5px);
}

.content-clicktosave .btn-necom:hover .lbulb {
  background-position: top right;
}

.content-clicktosave .no-underline {
  text-decoration: none !important;
}

.content-clicktosave .no-underline:hover {
  text-decoration: none !important;
}

.content-clicktosave .nav-item.active a {
  background-color: #efefef;
  border-radius: 5px;
}

.content-clicktosave .rblock {
  border: 1px solid #e4e4e4;
  border-radius: 14px;
  background-size: cover;
  background-position: center;
}

.content-clicktosave .rblock__label {
  position: absolute;
  display: none;
  top: 15px;
  right: 30px;
  padding: 5px 10px;
  background-color: #fff;
  color: #3A3B3B;
  font-size: 10px;
  font-style: normal;
  font-weight: 400;
  border-radius: 15px;
}

.content-clicktosave .rblock--noborder {
  border: none;
}

.content-clicktosave .rblock--light {
  background-color: #F0F0F0;
}

.content-clicktosave .rblock--black {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.79), black);
}

.content-clicktosave .rblock--0, .content-clicktosave .rblock--1, .content-clicktosave .rblock--green {
  background: linear-gradient(to bottom, #22722e, #016110);
}

.content-clicktosave .rblock--2, .content-clicktosave .rblock--3, .content-clicktosave .rblock--orange {
  background: linear-gradient(to bottom, rgba(236, 139, 0, 0.79), #ec8b00);
}

.content-clicktosave .rblock--4, .content-clicktosave .rblock--5, .content-clicktosave .rblock--red {
  background: linear-gradient(to bottom, rgba(143, 3, 2, 0.79), #8f0302);
}

.content-clicktosave .rblock--6, .content-clicktosave .rblock--7 {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.79), black);
}

.content-clicktosave .rblock p {
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
  margin: 0;
  padding: 0;
}

.content-clicktosave .rblock .h3 {
  font-size: 1.875rem;
  line-height: 2.1rem !important;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
  margin: 0;
  padding: 0;
}

.content-clicktosave .rblock .h4 {
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.3;
  padding: 0;
}

.content-clicktosave .play-button img {
  transform: scale(1);
  transition: transform 0.2s ease-in-out;
}

.content-clicktosave .buzz-video:hover .play-button img {
  transform: scale(1.2);
}

.content-clicktosave .w-33 {
  width: 33.3333333333%;
  flex-shrink: 0;
}

.content-clicktosave .l-bulb {
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center right;
  object-position: center right;
  margin-right: -10px;
}

.content-clicktosave .no-overflow {
  overflow: hidden;
}

.content-clicktosave .dashguage {
  position: relative;
  width: 100%;
  max-width: 250px;
  margin: 0 auto;
  padding-bottom: 40%;
  background-image: url(/img/necom/guage.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.content-clicktosave .dashguage__pin {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-image: url(/img/necom/guage-pin.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  transform-origin: center 75%;
  transition: transform 0.5s ease-in-out;
}

.content-clicktosave .dashguage__pin--1 {
  transform: rotate(-85deg);
}

.content-clicktosave .dashguage__pin--2 {
  transform: rotate(-50deg);
}

.content-clicktosave .dashguage__pin--3 {
  transform: rotate(0deg);
}

.content-clicktosave .dashguage__pin--4 {
  transform: rotate(50deg);
}

.content-clicktosave .dashguage__pin--5 {
  transform: rotate(85deg);
}

.content-clicktosave .dashprovinces li {
  font-weight: 700;
}

.content-clicktosave .dashprovinces .prov-title {
  font-weight: 700;
}

.content-clicktosave .dashprovinces .prov-watt {
  font-weight: 400;
  white-space: nowrap;
  padding-right: 25px;
  background-repeat: no-repeat;
  background-position: right center;
}

.content-clicktosave .dashprovinces .prov-watt--up {
  background-image: url(/img/necom/up.svg);
}

.content-clicktosave .dashprovinces .prov-watt--down {
  background-image: url(/img/necom/down.svg);
}

.content-clicktosave h1, .content-clicktosave .h1 {
  font-size: 26px;
  line-height: calc(26px + 2.6px);
  font-weight: bold;
}

@media screen and (min-width: 376px) {
  .content-clicktosave h1, .content-clicktosave .h1 {
    font-size: calc(26px + 34 * ((100vw - 376px) / 794));
    line-height: calc(26px + 34 * ((100vw - 376px) / 794) + 2.6px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave h1, .content-clicktosave .h1 {
    font-size: 60px;
    line-height: calc(60px + 6px);
  }
}

.content-clicktosave h2, .content-clicktosave .h2 {
  font-size: 22px;
  line-height: calc(22px + 2.2px);
  margin-bottom: 0.5em;
  font-weight: bold;
}

@media screen and (min-width: 376px) {
  .content-clicktosave h2, .content-clicktosave .h2 {
    font-size: calc(22px + 23 * ((100vw - 376px) / 794));
    line-height: calc(22px + 23 * ((100vw - 376px) / 794) + 2.2px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave h2, .content-clicktosave .h2 {
    font-size: 45px;
    line-height: calc(45px + 4.5px);
  }
}

.content-clicktosave .h2a {
  font-size: 22px;
  line-height: calc(22px + 2.2px);
  font-weight: bold;
}

@media screen and (min-width: 376px) {
  .content-clicktosave .h2a {
    font-size: calc(22px + 33 * ((100vw - 376px) / 794));
    line-height: calc(22px + 33 * ((100vw - 376px) / 794) + 2.2px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave .h2a {
    font-size: 55px;
    line-height: calc(55px + 5.5px);
  }
}

.content-clicktosave h3, .content-clicktosave .h3 {
  text-transform: unset;
  font-size: 18px;
  line-height: calc(18px + 1.8px);
  font-weight: bold;
}

@media screen and (min-width: 376px) {
  .content-clicktosave h3, .content-clicktosave .h3 {
    font-size: calc(18px + 25 * ((100vw - 376px) / 794));
    line-height: calc(18px + 25 * ((100vw - 376px) / 794) + 1.8px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave h3, .content-clicktosave .h3 {
    font-size: 43px;
    line-height: calc(43px + 4.3px);
  }
}

@media screen and (min-width: 769px) {
  .content-clicktosave h3, .content-clicktosave .h3 {
    font-size: 30px;
    font-size: 1.875rem;
  }
}

.content-clicktosave .h3a {
  font-size: 1.875rem;
  line-height: 2.1rem !important;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
  margin: 0;
  padding: 0;
}

.content-clicktosave h4, .content-clicktosave .h4 {
  font-size: 18px;
  font-size: 1.125rem;
}

@media screen and (min-width: 769px) {
  .content-clicktosave h4, .content-clicktosave .h4 {
    font-size: 22px;
    font-size: 1.375rem;
  }
}

.content-clicktosave h5, .content-clicktosave .h5 {
  font-size: 1.2em;
}

.content-clicktosave h6, .content-clicktosave .h6 {
  font-size: 1.1em;
}

.content-clicktosave p, .content-clicktosave span:not(.textInherit) {
  font-size: 16px;
  line-height: calc(16px + 12.8px);
}

@media screen and (min-width: 376px) {
  .content-clicktosave p, .content-clicktosave span:not(.textInherit) {
    font-size: calc(16px + 2 * ((100vw - 376px) / 794));
    line-height: calc(16px + 2 * ((100vw - 376px) / 794) + 12.8px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave p, .content-clicktosave span:not(.textInherit) {
    font-size: 18px;
    line-height: calc(18px + 14.4px);
  }
}

.content-clicktosave a {
  color: #308765;
  text-decoration: underline;
}

.content-clicktosave a:hover {
  color: #308765;
  text-decoration: underline;
}

.content-clicktosave h1 {
  font-family: 'Poppins', sans-serif;
  text-transform: none;
}

.content-clicktosave p.lead {
  font-size: 20px;
  line-height: calc(20px + 6px);
  font-weight: normal;
}

@media screen and (min-width: 376px) {
  .content-clicktosave p.lead {
    font-size: calc(20px + 4 * ((100vw - 376px) / 794));
    line-height: calc(20px + 4 * ((100vw - 376px) / 794) + 6px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave p.lead {
    font-size: 24px;
    line-height: calc(24px + 7.2px);
  }
}

.content-clicktosave .fw-400 {
  font-weight: 400 !important;
}

.content-clicktosave .fw-500 {
  font-weight: 500 !important;
}

.content-clicktosave .fw-600 {
  font-weight: 600 !important;
}

.content-clicktosave .fw-700 {
  font-weight: 700 !important;
}

.content-clicktosave .fw-800 {
  font-weight: 800 !important;
}

.content-clicktosave .fw-bold {
  font-weight: bold !important;
}

.content-clicktosave .fs-1 {
  font-size: 36px;
  line-height: calc(36px + 7.2px);
}

@media screen and (min-width: 376px) {
  .content-clicktosave .fs-1 {
    font-size: calc(36px + 9 * ((100vw - 376px) / 794));
    line-height: calc(36px + 9 * ((100vw - 376px) / 794) + 7.2px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave .fs-1 {
    font-size: 45px;
    line-height: calc(45px + 9px);
  }
}

.content-clicktosave .fs-2 {
  font-size: 30px;
  line-height: calc(30px + 6px);
}

@media screen and (min-width: 376px) {
  .content-clicktosave .fs-2 {
    font-size: calc(30px + 8 * ((100vw - 376px) / 794));
    line-height: calc(30px + 8 * ((100vw - 376px) / 794) + 6px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave .fs-2 {
    font-size: 38px;
    line-height: calc(38px + 7.6px);
  }
}

.content-clicktosave .fs-3 {
  font-size: 24px;
  line-height: calc(24px + 4.8px);
}

@media screen and (min-width: 376px) {
  .content-clicktosave .fs-3 {
    font-size: calc(24px + 6 * ((100vw - 376px) / 794));
    line-height: calc(24px + 6 * ((100vw - 376px) / 794) + 4.8px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave .fs-3 {
    font-size: 30px;
    line-height: calc(30px + 6px);
  }
}

.content-clicktosave .fs-4 {
  font-size: 22px;
  line-height: calc(22px + 4.4px);
}

@media screen and (min-width: 376px) {
  .content-clicktosave .fs-4 {
    font-size: calc(22px + 4 * ((100vw - 376px) / 794));
    line-height: calc(22px + 4 * ((100vw - 376px) / 794) + 4.4px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave .fs-4 {
    font-size: 26px;
    line-height: calc(26px + 5.2px);
  }
}

.content-clicktosave .fs-5 {
  font-size: 16px;
  line-height: calc(16px + 3.2px);
}

@media screen and (min-width: 376px) {
  .content-clicktosave .fs-5 {
    font-size: calc(16px + 4 * ((100vw - 376px) / 794));
    line-height: calc(16px + 4 * ((100vw - 376px) / 794) + 3.2px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave .fs-5 {
    font-size: 20px;
    line-height: calc(20px + 4px);
  }
}

.content-clicktosave .fs-6 {
  font-size: 14px;
  line-height: calc(14px + 2.8px);
}

@media screen and (min-width: 376px) {
  .content-clicktosave .fs-6 {
    font-size: calc(14px + 2 * ((100vw - 376px) / 794));
    line-height: calc(14px + 2 * ((100vw - 376px) / 794) + 2.8px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave .fs-6 {
    font-size: 16px;
    line-height: calc(16px + 3.2px);
  }
}

.content-clicktosave .fs-7 {
  font-size: 12px;
  line-height: calc(12px + 2.4px);
}

@media screen and (min-width: 376px) {
  .content-clicktosave .fs-7 {
    font-size: calc(12px + 2 * ((100vw - 376px) / 794));
    line-height: calc(12px + 2 * ((100vw - 376px) / 794) + 2.4px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave .fs-7 {
    font-size: 14px;
    line-height: calc(14px + 2.8px);
  }
}

.content-clicktosave .text-muted {
  opacity: 0.8;
}

.content-clicktosave .cts-hero {
  background-repeat: no-repeat;
  padding-bottom: 42%;
  min-height: 500px;
  max-height: 850px;
  overflow: hidden;
  position: relative;
}

@media screen and (max-width: 769px) {
  .content-clicktosave .cts-hero--content {
    padding-bottom: 0;
    min-height: 600px;
  }
}

.content-clicktosave .cts-hero--cover {
  background-position: center;
  background-size: cover;
  padding-bottom: 45%;
}

.content-clicktosave .cts-hero--contain {
  background-position: top center;
  background-size: contain;
}

.content-clicktosave .cts-hero__inner {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.content-clicktosave .cts-hero__necom--dark {
  background-color: black;
}

.content-clicktosave .cts-hero__necom--bigtitle h2.h2a {
  font-size: 40px;
  line-height: calc(40px + 4px);
}

@media screen and (min-width: 376px) {
  .content-clicktosave .cts-hero__necom--bigtitle h2.h2a {
    font-size: calc(40px + 15 * ((100vw - 376px) / 794));
    line-height: calc(40px + 15 * ((100vw - 376px) / 794) + 4px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave .cts-hero__necom--bigtitle h2.h2a {
    font-size: 55px;
    line-height: calc(55px + 5.5px);
  }
}

.content-clicktosave .cts-hero__necom--eap {
  background: linear-gradient(137deg, #696969 0%, rgba(112, 118, 99, 0.73) 100%);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

.content-clicktosave .cts-hero__necom--home {
  background: linear-gradient(134deg, rgba(83, 90, 69, 0.8) 0%, rgba(127, 136, 111, 0.64) 40.07%, rgba(215, 228, 190, 0.1) 100%);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

.content-clicktosave .cts-hero__necom--business {
  background: linear-gradient(137deg, #24303C 0%, rgba(36, 48, 60, 0.6) 100%);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

@media screen and (min-width: 769px) {
  .content-clicktosave .cts-hero__necom {
    position: absolute;
    top: 0;
    width: 42%;
    bottom: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.4);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
  }
}

@media screen and (min-width: 769px) {
  .content-clicktosave .cts-hero__necom--left {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 42%;
    background-color: rgba(0, 0, 0, 0.4);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
  }
}

.content-clicktosave .cts-hero__necom img {
  max-width: 135px;
}

.content-clicktosave .cts-hero__necom h2 {
  opacity: 0.8;
  color: #fff;
}

.content-clicktosave .cts-hero__necom p {
  width: 100%;
  opacity: 0.8;
  font-size: 14px;
  line-height: calc(14px + 5.6px);
  line-height: 1.5em;
  color: #fff;
}

@media screen and (min-width: 376px) {
  .content-clicktosave .cts-hero__necom p {
    font-size: calc(14px + 1 * ((100vw - 376px) / 794));
    line-height: calc(14px + 1 * ((100vw - 376px) / 794) + 5.6px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave .cts-hero__necom p {
    font-size: 15px;
    line-height: calc(15px + 6px);
  }
}

@media screen and (min-width: 769px) {
  .content-clicktosave .cts-hero__necom p {
    max-width: 430px;
  }
}

.content-clicktosave .cts-hero__necom--hold {
  position: absolute;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  top: 0;
  bottom: 0;
}

@media screen and (min-width: 769px) {
  .content-clicktosave .cts-hero__necom--hold {
    width: 70%;
  }
}

@media screen and (min-width: 1200px) {
  .content-clicktosave .cts-hero__necom--hold {
    width: 40% !important;
  }
}

.content-clicktosave .cts-hero__necom--hold-left {
  left: 0;
}

.content-clicktosave .cts-hero__necom--hold-right {
  right: 0;
}

.content-clicktosave .cts-hero__necom--hold p {
  width: 100%;
  opacity: 0.8;
  font-size: 14px;
  line-height: calc(14px + 5.6px);
  line-height: 1.5em;
  color: #fff;
}

@media screen and (min-width: 376px) {
  .content-clicktosave .cts-hero__necom--hold p {
    font-size: calc(14px + 1.5 * ((100vw - 376px) / 794));
    line-height: calc(14px + 1.5 * ((100vw - 376px) / 794) + 5.6px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave .cts-hero__necom--hold p {
    font-size: 15.5px;
    line-height: calc(15.5px + 6.2px);
  }
}

@media screen and (min-width: 769px) {
  .content-clicktosave .cts-hero__necom--hold p {
    max-width: 95%;
  }
}

.content-clicktosave .img__content--bottom {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 40px;
  z-index: 1;
}

.content-clicktosave .square-img {
  border-radius: 20px;
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  background-position: center;
  background-size: cover;
}

.content-clicktosave .square-img__inner {
  transform: scale(1);
  transition: transform 0.2s ease-in-out;
}

.content-clicktosave .square-img__linkwrap:hover .square-img__inner {
  transform: scale(1.02);
}

.content-clicktosave .rounded-shadow {
  border-radius: 20px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

.content-clicktosave .op-1 {
  opacity: 0.1;
}

.content-clicktosave .op-2 {
  opacity: 0.2;
}

.content-clicktosave .op-3 {
  opacity: 0.3;
}

.content-clicktosave .op-4 {
  opacity: 0.4;
}

.content-clicktosave .op-5 {
  opacity: 0.5;
}

.content-clicktosave .op-6 {
  opacity: 0.6;
}

.content-clicktosave .op-7 {
  opacity: 0.7;
}

.content-clicktosave .op-8 {
  opacity: 0.8;
}

.content-clicktosave .op-9 {
  opacity: 0.9;
}

.content-clicktosave header {
  z-index: 9999;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}

.content-clicktosave .header__spacer {
  position: relative;
  display: block;
  width: 100%;
  height: 90px;
}

.content-clicktosave .nav-link {
  text-decoration: none;
}

.content-clicktosave .nav-link:hover {
  text-decoration: none;
}

.content-clicktosave .justTransitionHome {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  border-radius: 20px;
  overflow: hidden;
  position: relative;
}

.content-clicktosave .justTransitionHome__flag {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background-image: url("/img/necom/flag-left.jpg");
  background-size: 35%;
  background-position: top left;
  background-repeat: no-repeat;
}

.content-clicktosave .justTransitionHome__powerlines {
  position: absolute;
  top: 0;
  left: 40%;
  width: 60%;
  height: 100%;
  pointer-events: none;
  background-image: url("/img/necom/powerlines-right.jpg");
  background-size: 80%;
  background-position: bottom right;
  background-repeat: no-repeat;
  transform-origin: bottom center;
  transform: scale(1) translateY(55px);
  transition: transform 0.3s ease-in-out;
}

.content-clicktosave .justTransitionHome:hover .justTransitionHome__powerlines {
  transition: transform 0.8s ease-in-out;
  transform: scale(1.08) translateY(15px);
}

.content-clicktosave .top-priorities li {
  border: 1px solid #c3c3c3;
  background-color: #fff;
}

.content-clicktosave .top-priorities li p {
  margin-bottom: 0;
}

.content-clicktosave .bright-banner {
  border-radius: 20px;
  background: rgba(135, 168, 201, 0.1);
  overflow: hidden;
}

.content-clicktosave .bright-banner:not(.bright-banner--full):before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 45%;
  height: 100%;
  z-index: 1;
  background-image: url(/img/necom/pylons-bright.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  border-radius: 0 20px 20px 0;
}

@media screen and (max-width: 1200px) {
  .content-clicktosave .bright-banner:not(.bright-banner--full):before {
    position: relative;
    display: block;
    width: calc(100% + 80px);
    margin-left: -40px;
    margin-top: -40px;
    border-radius: 20px 20px 0 0;
    padding-bottom: 40%;
  }
}

.content-clicktosave .cost-tips {
  display: none;
}

.content-clicktosave .cost-tips--visible {
  display: flex;
}

.content-clicktosave .bright-idea__button {
  cursor: pointer;
  text-transform: uppercase;
  border-radius: 8px;
}

.content-clicktosave .bright-idea__button img.icon-tilt {
  transform: rotate(0deg);
  transition: transform 0.4s ease-in-out;
}

.content-clicktosave .bright-idea__button img.icon-arrow {
  transform: rotate(180deg);
  transition: transform 0.4s ease-in-out 0.1s;
}

.content-clicktosave .bright-idea__button.active {
  border-radius: 8px 8px 0 0;
}

.content-clicktosave .bright-idea__content {
  background-color: #F4F7EF;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease-in-out;
}

.content-clicktosave .bright-idea.active .bright-idea__content {
  max-height: 1000px;
  transition: max-height 0.5s ease-in-out;
}

.content-clicktosave .bright-idea.active img.icon-arrow {
  transform: rotate(0deg);
  transition: transform 0.4s ease-in-out;
}

.content-clicktosave .bright-idea.home-energy-savings .bright-idea__button {
  background-color: #E2EAD4;
}

.content-clicktosave .bright-idea.home-energy-savings .bright-idea__button:hover {
  background-color: #dce4cd;
}

.content-clicktosave .bright-idea.home-energy-savings .bright-idea__button:hover img.icon-tilt {
  transform: rotate(25deg);
}

.content-clicktosave .bright-idea.business-energy-savings .bright-idea__button {
  background-color: #C4D2DE;
}

.content-clicktosave .bright-idea.business-energy-savings .bright-idea__button:hover {
  background-color: #bbc9d5;
}

.content-clicktosave .bright-idea.business-energy-savings .bright-idea__button:hover img.icon-tilt {
  transform: rotate(25deg);
}

.content-clicktosave .bright-idea.business-energy-savings .bright-idea__content {
  background-color: #EDF1F5;
}

.content-clicktosave .home-energy-savings .action-text {
  border-radius: 24px;
  background: #F6F5F8;
}

.content-clicktosave .business-energy-savings .action-text {
  border-radius: 24px;
  background: #F6F5F8;
}

.content-clicktosave .filter-navigation__wrapper {
  position: -webkit-sticky;
  position: sticky;
  top: 120px;
}

.content-clicktosave .filter-navigation__button {
  border-radius: 4px;
  border: 1px solid #B9B9B9;
  background: #FFF;
  color: #000;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  transform: scale(1);
  transition: transform 0.1s ease-in-out;
}

.content-clicktosave .filter-navigation__button:hover {
  transform: scale(1.05);
}

.content-clicktosave .filter-navigation__button a {
  color: #000;
  text-decoration: none;
}

.content-clicktosave .home-energy-savings .filter-navigation__button.active {
  background-color: #D7E4BE;
}

.content-clicktosave .business-energy-savings .filter-navigation__button.active {
  background-color: #2E3943;
}

.content-clicktosave .business-energy-savings .filter-navigation__button.active a {
  color: #fff !important;
}

.content-clicktosave .top-nav-tips {
  margin: 15px 0;
  gap: 10px;
}

@media screen and (min-width: 1050px) {
  .content-clicktosave .top-nav-tips {
    position: absolute;
    top: 15px;
    right: 30px;
  }
}

.content-clicktosave .top-nav-tips a {
  display: flex;
  height: 69px;
  padding: 10px 25px;
  justify-content: center;
  align-items: center;
  border-radius: 4px;
  background: #D7E4BE;
  text-decoration: none;
  color: #000;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}

.content-clicktosave .top-nav-tips a:hover {
  opacity: 0.9;
}

.content-clicktosave .business-energy-savings .top-nav-tips a {
  background: #2E3943;
  color: #fff;
}

.content-clicktosave .arrowList {
  list-style: none;
  padding: 0;
  margin: 0;
}

.content-clicktosave .arrowList li {
  padding-left: 30px;
  position: relative;
}

.content-clicktosave .arrowList li:before {
  content: '';
  position: absolute;
  top: 7px;
  left: 0;
  width: 0;
  height: 0;
  border: 10px solid transparent;
  border-left: 15px solid #FCB524;
}

.content-clicktosave .iconList_item {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 30px;
}

.content-clicktosave .iconList_item:not(:last-of-type) .iconList_content {
  margin-bottom: 25px;
  padding-bottom: 25px;
  border-bottom: 3px dotted #415A90;
}

.content-clicktosave .iconList_img {
  flex-grow: 0;
  flex-shrink: 0;
  width: 75px;
}

.content-clicktosave .iconList_content {
  width: 100%;
  min-height: 90px;
}

.content-clicktosave .iconList_content p:last-of-type {
  margin: 0;
}

.content-clicktosave .keyList {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
}

.content-clicktosave .keyList_item {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 20px;
  width: 100%;
}

@media screen and (min-width: 769px) {
  .content-clicktosave .keyList_item {
    width: 48%;
  }
}

@media screen and (min-width: 992px) {
  .content-clicktosave .keyList_item {
    width: 30%;
  }
}

.content-clicktosave .keyList_img {
  flex-grow: 0;
  flex-shrink: 0;
  width: 50px;
}

.content-clicktosave .keyList_content {
  width: 100%;
}

.content-clicktosave .keyList_content p {
  margin: 0;
  text-align: left;
}

.content-clicktosave .blockItem {
  background-color: #BDBDBD;
  padding-top: 100%;
  margin-bottom: 2em;
}

.content-clicktosave .blockItem_list > div:nth-of-type(3n-2) .blockItem {
  background-color: #BDBDBD;
}

.content-clicktosave .blockItem_list > div:nth-of-type(3n-1) .blockItem {
  background-color: #D3D3D3;
}

.content-clicktosave .blockItem_list > div:nth-of-type(3n) .blockItem {
  background-color: #EEE;
}

.content-clicktosave .pyeiDownload_icon {
  width: 60px;
  transition: transform 0.6s cubic-bezier(0.47, 1.64, 0.41, 0.8);
}

@media screen and (min-width: 769px) {
  .content-clicktosave .pyeiDownload_icon {
    width: 90px;
  }
}

.content-clicktosave .pyeiDownload_content {
  position: relative;
}

.content-clicktosave .pyeiDownload_content:before {
  content: '';
  display: block;
  opacity: 1;
  position: absolute;
  height: auto;
  top: 0;
  right: 0;
  left: 0;
  width: 100%;
  background-image: url("/assets/pyei/stripes_bg-tile.png");
  height: 130px;
}

@media screen and (min-width: 769px) {
  .content-clicktosave .pyeiDownload_content {
    padding-left: 90px;
  }
  .content-clicktosave .pyeiDownload_content:before {
    height: auto;
    right: initial;
    bottom: 0;
    left: 90px;
    width: 25%;
  }
}

@media screen and (min-width: 992px) {
  .content-clicktosave .pyeiDownload_content.smaller {
    padding-left: 30px;
  }
  .content-clicktosave .pyeiDownload_content.smaller:before {
    height: auto;
    right: initial;
    bottom: 0;
    left: 30px;
    width: 10px;
  }
}

.content-clicktosave .pyeiDownload_head, .content-clicktosave .pyeiDownload_body {
  padding: 20px;
}

@media screen and (min-width: 769px) {
  .content-clicktosave .pyeiDownload_head, .content-clicktosave .pyeiDownload_body {
    padding: 20px 20px 20px 30%;
  }
}

@media screen and (min-width: 992px) {
  .content-clicktosave .pyeiDownload_head.smaller, .content-clicktosave .pyeiDownload_body.smaller {
    padding: 20px 20px 20px 20px;
  }
}

.content-clicktosave .pyeiDownload_head {
  color: #000;
  background-color: #FCB524;
}

@media screen and (max-width: 768px) {
  .content-clicktosave .pyeiDownload_head {
    padding-top: 150px;
  }
}

.content-clicktosave .pyeiDownload_body {
  background-color: #00774b;
}

.content-clicktosave .pyeiDownload_mainImage {
  display: block;
  width: 250px;
  position: relative;
  top: 0;
  left: 0;
  z-index: 1;
  margin: 0 auto -80px;
  transform: rotate(350deg);
  box-shadow: 5px 5px 35px -8px rgba(0, 0, 0, 0.3);
}

@media screen and (min-width: 769px) {
  .content-clicktosave .pyeiDownload_mainImage {
    width: 200px;
    margin: 0;
    position: absolute;
    top: 50%;
    left: 40px;
    transform: translateY(-50%) rotate(350deg);
  }
}

@media screen and (min-width: 992px) {
  .content-clicktosave .pyeiDownload_mainImage {
    width: 240px;
  }
  .content-clicktosave .pyeiDownload_mainImage.smaller {
    width: 200px;
    position: relative;
    transform: none;
    left: 50%;
    transform: translateX(-50%) rotate(350deg);
  }
}

.content-clicktosave .pyeiDownload h3 {
  font-size: 28px;
  font-size: 1.75rem;
}

@media screen and (min-width: 769px) {
  .content-clicktosave .pyeiDownload h3 {
    font-size: 38px;
    font-size: 2.375rem;
  }
}

.content-clicktosave .pyeiDownload_inner {
  display: block;
  padding: 30px 0;
  text-decoration: none;
}

.content-clicktosave .pyeiDownload_inner:hover {
  text-decoration: none;
}

.content-clicktosave .pyeiDownload_inner:hover .pyeiDownload_icon {
  transform: scale(1.1);
}

@media screen and (min-width: 769px) {
  .content-clicktosave .pyeiDownload_inner {
    padding: 90px 0;
  }
}

.content-clicktosave .pyeiForm_inputWrapper label {
  display: none;
}

.content-clicktosave .pyeiForm_inputWrapper textarea,
.content-clicktosave .pyeiForm_inputWrapper select,
.content-clicktosave .pyeiForm_inputWrapper input {
  width: 100%;
  border: 1px solid #aaa;
  box-shadow: none;
  outline: 0;
  color: #212529;
  font-size: 20px;
  font-size: 1.25rem;
  margin-bottom: 15px;
  padding: 10px;
}

.content-clicktosave .pyeiForm_inputWrapper textarea:-ms-input-placeholder,
.content-clicktosave .pyeiForm_inputWrapper select:-ms-input-placeholder,
.content-clicktosave .pyeiForm_inputWrapper input:-ms-input-placeholder {
  color: #aaa;
}

.content-clicktosave .pyeiForm_inputWrapper textarea::placeholder,
.content-clicktosave .pyeiForm_inputWrapper select::placeholder,
.content-clicktosave .pyeiForm_inputWrapper input::placeholder {
  color: #aaa;
}

.content-clicktosave .pyeiForm_inputWrapper select {
  -webkit-appearance: none;
  -moz-appearance: none;
  background: transparent;
  background-image: url("data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");
  background-repeat: no-repeat;
  background-position-x: calc(100% - 15px);
  background-position-y: 45%;
}

.content-clicktosave .pyeiForm_inputWrapper.organisationType_wrapper.isPlaceholder select {
  color: #aaa;
}

.content-clicktosave .pyeiForm__submitButton {
  background-color: #308765;
  border-radius: 50px;
  padding: 5px 30px;
  font-weight: bold;
  font-size: 18px;
  color: #fff;
  text-transform: uppercase;
  display: block;
  width: 230px;
}

.content-clicktosave .actionPlanBannner {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  overflow: hidden;
  position: relative;
  display: flex;
  justify-content: start;
  align-items: center;
  padding: 20px;
  min-height: 100px;
}

@media screen and (min-width: 992px) {
  .content-clicktosave .actionPlanBannner {
    padding: 0 35px 0 200px;
    min-height: 200px;
  }
}

.content-clicktosave .actionPlanBannner__flag {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background-image: url("/img/necom/flag-left.jpg");
  background-size: contain;
  background-position: top left;
  background-repeat: no-repeat;
}

.content-clicktosave .actionPlanBannner__powerlines {
  position: absolute;
  z-index: 0;
  top: 0;
  right: 0;
  width: 40%;
  height: 100%;
  pointer-events: none;
  background-image: url("/img/necom/powerlines.png");
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  transition: transform 0.3s ease-in-out;
}

.content-clicktosave .actionPlanBannner__content {
  position: relative;
  z-index: 1;
}

@media screen and (min-width: 992px) {
  .content-clicktosave .actionPlanBannner__content {
    max-width: 650px;
  }
}

.content-clicktosave .actionPlanBannner__content h2 {
  background-color: rgba(255, 255, 255, 0.8);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  text-shadow: 0 0 5px rgba(255, 255, 255, 0.2);
  border-radius: 30px;
}

.content-clicktosave .actionPlanBannner:hover .justTransitionHome__powerlines {
  transition: transform 0.8s ease-in-out;
  transform: scale(1.08) translateY(15px);
}

.content-clicktosave .rounded-img {
  border-radius: 20px;
}

.content-clicktosave .planStep__side-image {
  height: 100%;
  min-height: 300px;
  border-radius: 20px;
  background-size: cover;
  background-position: center;
}

.content-clicktosave .planStep__index {
  color: rgba(50, 50, 50, 0.1);
  font-size: 70px;
  line-height: calc(70px + -21px);
  font-style: normal;
  font-weight: 800;
  padding-bottom: 20px;
  float: left;
  margin-right: 15px;
  margin-top: -10px;
}

@media screen and (min-width: 376px) {
  .content-clicktosave .planStep__index {
    font-size: calc(70px + 70 * ((100vw - 376px) / 794));
    line-height: calc(70px + 70 * ((100vw - 376px) / 794) + -21px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave .planStep__index {
    font-size: 140px;
    line-height: calc(140px + -42px);
  }
}

@media screen and (min-width: 794px) {
  .content-clicktosave .planStep__index {
    margin-top: 0;
    margin-right: 25px;
  }
}

.content-clicktosave .planStep__body h3 {
  font-size: 24px;
  line-height: calc(24px + 2.4px);
  font-weight: bold;
  margin-bottom: 0.5em;
}

@media screen and (min-width: 376px) {
  .content-clicktosave .planStep__body h3 {
    font-size: calc(24px + 12 * ((100vw - 376px) / 794));
    line-height: calc(24px + 12 * ((100vw - 376px) / 794) + 2.4px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave .planStep__body h3 {
    font-size: 36px;
    line-height: calc(36px + 3.6px);
  }
}

.content-clicktosave .planStep__list {
  margin-left: 25px;
}

@media screen and (max-width: 995px) {
  .content-clicktosave .planStep__list {
    clear: both;
  }
}

.content-clicktosave .planStep__list li {
  font-size: 14px;
  line-height: calc(14px + 7px);
  position: relative;
  margin-bottom: 10px;
}

@media screen and (min-width: 376px) {
  .content-clicktosave .planStep__list li {
    font-size: calc(14px + 2 * ((100vw - 376px) / 794));
    line-height: calc(14px + 2 * ((100vw - 376px) / 794) + 7px);
  }
}

@media screen and (min-width: 1170px) {
  .content-clicktosave .planStep__list li {
    font-size: 16px;
    line-height: calc(16px + 8px);
  }
}

.content-clicktosave .planStep__list li:last-child {
  margin-bottom: 0;
}

.content-clicktosave .planStep__list li:before {
  content: '';
  position: absolute;
  top: 11px;
  border-radius: 50%;
  background-color: #000;
  transform: translateY(-50%);
  left: -15px;
  width: 4px;
  height: 4px;
}

@media screen and (min-width: 794px) {
  .content-clicktosave .planStep__list li:before {
    left: -20px;
    width: 6px;
    height: 6px;
  }
}

.rfs-1 {
  font-size: 0.15rem;
}

.rfs-2 {
  font-size: 0.3rem;
}

.rfs-3 {
  font-size: 0.45rem;
}

.rfs-4 {
  font-size: 0.6rem;
}

.rfs-5 {
  font-size: 0.75rem;
}

.rfs-6 {
  font-size: 0.9rem;
}

.rfs-7, .content-2024 p.small, .content-2024 span.small {
  font-size: 1.05rem;
}

.rfs-8, .content-2024 p, .content-2024 span, p, .p {
  font-size: 1.2rem;
}

.rfs-9, .content-2024 h8, .content-2024 .h8, .content-2024 p.lead, .content-2024 span.lead {
  font-size: calc(1.26rem + 0.075vw);
}

@media (min-width: 1920px) {
  .rfs-9, .content-2024 h8, .content-2024 .h8, .content-2024 p.lead, .content-2024 span.lead {
    font-size: 1.35rem;
  }
}

.rfs-10, .lead, .productSlider h3.label-brand-slider, .productSlider .label-brand-slider.h3 {
  font-size: calc(1.275rem + 0.1875vw);
}

@media (min-width: 1920px) {
  .rfs-10, .lead, .productSlider h3.label-brand-slider, .productSlider .label-brand-slider.h3 {
    font-size: 1.5rem;
  }
}

.rfs-11, .content-2024 h7, .content-2024 .h7 {
  font-size: calc(1.29rem + 0.3vw);
}

@media (min-width: 1920px) {
  .rfs-11, .content-2024 h7, .content-2024 .h7 {
    font-size: 1.65rem;
  }
}

.rfs-12, .content-2024 h6, .content-2024 .h6 {
  font-size: calc(1.305rem + 0.4125vw);
}

@media (min-width: 1920px) {
  .rfs-12, .content-2024 h6, .content-2024 .h6 {
    font-size: 1.8rem;
  }
}

.rfs-13, .content-2024 h5, .content-2024 .h5 {
  font-size: calc(1.32rem + 0.525vw);
}

@media (min-width: 1920px) {
  .rfs-13, .content-2024 h5, .content-2024 .h5 {
    font-size: 1.95rem;
  }
}

.rfs-14, .content-2024 h4, .content-2024 .h4 {
  font-size: calc(1.335rem + 0.6375vw);
}

@media (min-width: 1920px) {
  .rfs-14, .content-2024 h4, .content-2024 .h4 {
    font-size: 2.1rem;
  }
}

.rfs-15 {
  font-size: calc(1.35rem + 0.75vw);
}

@media (min-width: 1920px) {
  .rfs-15 {
    font-size: 2.25rem;
  }
}

.rfs-16, .content-2024 h3, .content-2024 .h3 {
  font-size: calc(1.365rem + 0.8625vw);
}

@media (min-width: 1920px) {
  .rfs-16, .content-2024 h3, .content-2024 .h3 {
    font-size: 2.4rem;
  }
}

.rfs-17 {
  font-size: calc(1.38rem + 0.975vw);
}

@media (min-width: 1920px) {
  .rfs-17 {
    font-size: 2.55rem;
  }
}

.rfs-18, .content-2024 h2, .content-2024 .h2, h3, .h3 {
  font-size: calc(1.395rem + 1.0875vw);
}

@media (min-width: 1920px) {
  .rfs-18, .content-2024 h2, .content-2024 .h2, h3, .h3 {
    font-size: 2.7rem;
  }
}

.rfs-19 {
  font-size: calc(1.41rem + 1.2vw);
}

@media (min-width: 1920px) {
  .rfs-19 {
    font-size: 2.85rem;
  }
}

.rfs-20 {
  font-size: calc(1.425rem + 1.3125vw);
}

@media (min-width: 1920px) {
  .rfs-20 {
    font-size: 3rem;
  }
}

.rfs-21 {
  font-size: calc(1.44rem + 1.425vw);
}

@media (min-width: 1920px) {
  .rfs-21 {
    font-size: 3.15rem;
  }
}

.rfs-22, .content-2024 h1, .content-2024 .h1 {
  font-size: calc(1.455rem + 1.5375vw);
}

@media (min-width: 1920px) {
  .rfs-22, .content-2024 h1, .content-2024 .h1 {
    font-size: 3.3rem;
  }
}

.rfs-23 {
  font-size: calc(1.47rem + 1.65vw);
}

@media (min-width: 1920px) {
  .rfs-23 {
    font-size: 3.45rem;
  }
}

.rfs-24 {
  font-size: calc(1.485rem + 1.7625vw);
}

@media (min-width: 1920px) {
  .rfs-24 {
    font-size: 3.6rem;
  }
}

.rfs-25 {
  font-size: calc(1.5rem + 1.875vw);
}

@media (min-width: 1920px) {
  .rfs-25 {
    font-size: 3.75rem;
  }
}

.rfs-26 {
  font-size: calc(1.515rem + 1.9875vw);
}

@media (min-width: 1920px) {
  .rfs-26 {
    font-size: 3.9rem;
  }
}

.rfs-27, h2, .h2 {
  font-size: calc(1.53rem + 2.1vw);
}

@media (min-width: 1920px) {
  .rfs-27, h2, .h2 {
    font-size: 4.05rem;
  }
}

.rfs-28 {
  font-size: calc(1.545rem + 2.2125vw);
}

@media (min-width: 1920px) {
  .rfs-28 {
    font-size: 4.2rem;
  }
}

.rfs-29 {
  font-size: calc(1.56rem + 2.325vw);
}

@media (min-width: 1920px) {
  .rfs-29 {
    font-size: 4.35rem;
  }
}

.rfs-30 {
  font-size: calc(1.575rem + 2.4375vw);
}

@media (min-width: 1920px) {
  .rfs-30 {
    font-size: 4.5rem;
  }
}

.rfs-31 {
  font-size: calc(1.59rem + 2.55vw);
}

@media (min-width: 1920px) {
  .rfs-31 {
    font-size: 4.65rem;
  }
}

.rfs-32 {
  font-size: calc(1.605rem + 2.6625vw);
}

@media (min-width: 1920px) {
  .rfs-32 {
    font-size: 4.8rem;
  }
}

.rfs-33 {
  font-size: calc(1.62rem + 2.775vw);
}

@media (min-width: 1920px) {
  .rfs-33 {
    font-size: 4.95rem;
  }
}

.rfs-34 {
  font-size: calc(1.635rem + 2.8875vw);
}

@media (min-width: 1920px) {
  .rfs-34 {
    font-size: 5.1rem;
  }
}

.rfs-35 {
  font-size: calc(1.65rem + 3vw);
}

@media (min-width: 1920px) {
  .rfs-35 {
    font-size: 5.25rem;
  }
}

.rfs-36 {
  font-size: calc(1.665rem + 3.1125vw);
}

@media (min-width: 1920px) {
  .rfs-36 {
    font-size: 5.4rem;
  }
}

.rfs-37 {
  font-size: calc(1.68rem + 3.225vw);
}

@media (min-width: 1920px) {
  .rfs-37 {
    font-size: 5.55rem;
  }
}

.rfs-38 {
  font-size: calc(1.695rem + 3.3375vw);
}

@media (min-width: 1920px) {
  .rfs-38 {
    font-size: 5.7rem;
  }
}

.rfs-39 {
  font-size: calc(1.71rem + 3.45vw);
}

@media (min-width: 1920px) {
  .rfs-39 {
    font-size: 5.85rem;
  }
}

.rfs-40 {
  font-size: calc(1.725rem + 3.5625vw);
}

@media (min-width: 1920px) {
  .rfs-40 {
    font-size: 6rem;
  }
}

.rfs-41 {
  font-size: calc(1.74rem + 3.675vw);
}

@media (min-width: 1920px) {
  .rfs-41 {
    font-size: 6.15rem;
  }
}

.rfs-42 {
  font-size: calc(1.755rem + 3.7875vw);
}

@media (min-width: 1920px) {
  .rfs-42 {
    font-size: 6.3rem;
  }
}

.rfs-43 {
  font-size: calc(1.77rem + 3.9vw);
}

@media (min-width: 1920px) {
  .rfs-43 {
    font-size: 6.45rem;
  }
}

.rfs-44 {
  font-size: calc(1.785rem + 4.0125vw);
}

@media (min-width: 1920px) {
  .rfs-44 {
    font-size: 6.6rem;
  }
}

.rfs-45 {
  font-size: calc(1.8rem + 4.125vw);
}

@media (min-width: 1920px) {
  .rfs-45 {
    font-size: 6.75rem;
  }
}

.rfs-46 {
  font-size: calc(1.815rem + 4.2375vw);
}

@media (min-width: 1920px) {
  .rfs-46 {
    font-size: 6.9rem;
  }
}

.rfs-47 {
  font-size: calc(1.83rem + 4.35vw);
}

@media (min-width: 1920px) {
  .rfs-47 {
    font-size: 7.05rem;
  }
}

.rfs-48 {
  font-size: calc(1.845rem + 4.4625vw);
}

@media (min-width: 1920px) {
  .rfs-48 {
    font-size: 7.2rem;
  }
}

.rfs-49 {
  font-size: calc(1.86rem + 4.575vw);
}

@media (min-width: 1920px) {
  .rfs-49 {
    font-size: 7.35rem;
  }
}

.rfs-50 {
  font-size: calc(1.875rem + 4.6875vw);
}

.news-banner {
  background: #F5F5F5;
  display: flex;
  margin-top: 20px;
}

.news-banner .news-banner-tag {
  background: #FEE220;
  font-size: 34px;
  padding: 6px 25px;
  font-weight: bold;
}

.news-banner #news-carousel {
  flex-grow: 1;
}

.news-banner .news-banner-headline {
  font-weight: bold;
  font-size: 34px;
  padding: 6px 25px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.news-banner .news-banner-headline a {
  color: #212529;
}

.news-banner .news-banner-controls {
  padding: 6px 12px;
  display: flex;
  align-items: center;
}

.news-banner .news-banner-controls button {
  background: none;
  border: none;
  padding: 4px 10px;
}

.news-banner .news-banner-controls button svg {
  width: 16px;
  height: 16px;
}

.carousel.vertical .carousel-item-next.carousel-item-left,
.carousel.vertical .carousel-item-prev.carousel-item-right {
  transform: translate3d(0, 0, 0);
}

.carousel.vertical .carousel-item-next,
.carousel.vertical .active.carousel-item-right {
  transform: translate3d(0, 100%, 0);
}

.carousel.vertical .carousel-item-prev,
.carousel.vertical .active.carousel-item-left {
  transform: translate3d(0, -100%, 0);
}

a.card,
a.card:hover {
  color: inherit;
}

.news-archive-wrap__overflow {
  display: none;
}

.news-archive-wrap__overflow.isActive {
  display: block;
}

#archiveToggler {
  position: relative;
  padding-right: 34px;
  margin-bottom: 1rem;
}

#archiveToggler span {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  display: block;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-top: 6px solid white;
}

#archiveToggler.isActive {
  display: none;
}

/*# sourceMappingURL=sona.css.map */